patch React compilation warnings and useEffect dependencies
This commit is contained in:
parent
9cac33cef3
commit
4c7fa1512d
13 changed files with 130 additions and 99 deletions
35
package-lock.json
generated
35
package-lock.json
generated
|
@ -3,6 +3,41 @@
|
|||
"requires": true,
|
||||
"lockfileVersion": 1,
|
||||
"dependencies": {
|
||||
"@babel/helper-plugin-utils": {
|
||||
"version": "7.8.3",
|
||||
"resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.8.3.tgz",
|
||||
"integrity": "sha512-j+fq49Xds2smCUNYmEHF9kGNkhbet6yVIBp4e6oeQpH1RUs/Ir06xUKzDjDkGcaaokPiTNs2JBWHjaE4csUkZQ==",
|
||||
"dev": true
|
||||
},
|
||||
"@babel/plugin-syntax-flow": {
|
||||
"version": "7.8.3",
|
||||
"resolved": "https://registry.npmjs.org/@babel/plugin-syntax-flow/-/plugin-syntax-flow-7.8.3.tgz",
|
||||
"integrity": "sha512-innAx3bUbA0KSYj2E2MNFSn9hiCeowOFLxlsuhXzw8hMQnzkDomUr9QCD7E9VF60NmnG1sNTuuv6Qf4f8INYsg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@babel/helper-plugin-utils": "^7.8.3"
|
||||
}
|
||||
},
|
||||
"@babel/plugin-transform-flow-strip-types": {
|
||||
"version": "7.8.3",
|
||||
"resolved": "https://registry.npmjs.org/@babel/plugin-transform-flow-strip-types/-/plugin-transform-flow-strip-types-7.8.3.tgz",
|
||||
"integrity": "sha512-g/6WTWG/xbdd2exBBzMfygjX/zw4eyNC4X8pRaq7aRHRoDUCzAIu3kGYIXviOv8BjCuWm8vDBwjHcjiRNgXrPA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@babel/helper-plugin-utils": "^7.8.3",
|
||||
"@babel/plugin-syntax-flow": "^7.8.3"
|
||||
}
|
||||
},
|
||||
"@babel/preset-flow": {
|
||||
"version": "7.8.3",
|
||||
"resolved": "https://registry.npmjs.org/@babel/preset-flow/-/preset-flow-7.8.3.tgz",
|
||||
"integrity": "sha512-iCXFk+T4demnq+dNLLvlGOgvYF6sPZ/hS1EmswugOqh1Ysp2vuiqJzpgsnp5rW8+6dLJT/0CXDzye28ZH6BAfQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@babel/helper-plugin-utils": "^7.8.3",
|
||||
"@babel/plugin-transform-flow-strip-types": "^7.8.3"
|
||||
}
|
||||
},
|
||||
"@evocateur/libnpmaccess": {
|
||||
"version": "3.1.2",
|
||||
"resolved": "https://registry.npmjs.org/@evocateur/libnpmaccess/-/libnpmaccess-3.1.2.tgz",
|
||||
|
|
10
package.json
10
package.json
|
@ -5,13 +5,15 @@
|
|||
"test": "lerna run test",
|
||||
"bootstrap": "lerna bootstrap"
|
||||
},
|
||||
"presets": ["@babel/preset-flow"],
|
||||
"devDependencies": {
|
||||
"lerna": "^3.20.2",
|
||||
"chai": "^4.2.0",
|
||||
"chai-http": "^4.3.0",
|
||||
"mocha": "^7.0.0",
|
||||
"@babel/preset-flow": "^7.8.3",
|
||||
"@testing-library/jest-dom": "^4.2.4",
|
||||
"@testing-library/react": "^9.4.0",
|
||||
"chai": "^4.2.0",
|
||||
"chai-http": "^4.3.0",
|
||||
"lerna": "^3.20.2",
|
||||
"mocha": "^7.0.0",
|
||||
"react-test-renderer": "^16.12.0"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,6 +1,5 @@
|
|||
import React, {useState, useEffect, useReducer} from 'react';
|
||||
import config from './config';
|
||||
import { Switch, Route, BrowserRouter as Router, Redirect } from 'react-router-dom';
|
||||
import React, { useEffect, useReducer} from 'react';
|
||||
import { Switch, Route, BrowserRouter as Router } from 'react-router-dom';
|
||||
import MainWrapper from './pages/Layout/MainWrapper/MainWrapper';
|
||||
import { stateReducer } from './reducers/reducer';
|
||||
import { initState } from './reducers/init/reducer.init';
|
||||
|
@ -15,30 +14,30 @@ function App() {
|
|||
initState
|
||||
);
|
||||
|
||||
const fetchIndexAPI = async () => {
|
||||
const response = await indexServices.indexService();
|
||||
if (response) {
|
||||
const action = {
|
||||
type: 'INDEX',
|
||||
message: 'SET_USER',
|
||||
body: response
|
||||
}
|
||||
dispatch(action)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
const fetchIndexAPI = async () => {
|
||||
const response = await indexServices.indexService();
|
||||
if (response) {
|
||||
const action = {
|
||||
type: 'INDEX',
|
||||
message: 'SET_USER',
|
||||
body: response
|
||||
}
|
||||
dispatch(action)
|
||||
}
|
||||
}
|
||||
fetchIndexAPI();
|
||||
}, [])
|
||||
|
||||
const socketConnect = () => {
|
||||
if (state.connect.type) return;
|
||||
dispatch({type:'SOCKET', message: 'LAUNCH', body:{nsp:'', dispatch}});
|
||||
}
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
const socketConnect = () => {
|
||||
if (state.connect.type) return;
|
||||
dispatch({type:'SOCKET', message: 'LAUNCH', body:{nsp:'', dispatch}});
|
||||
}
|
||||
socketConnect();
|
||||
}, [])
|
||||
}, [ state.connect ])
|
||||
|
||||
return (
|
||||
<Router>
|
||||
|
|
|
@ -18,7 +18,7 @@ const GameButton = (props) => {
|
|||
const renderOpenGame = () => {
|
||||
return (
|
||||
<>
|
||||
<a onClick={() => requestJoinGame()} >Request to Join Game</a>
|
||||
<div onClick={() => requestJoinGame()} >Request to Join Game</div>
|
||||
|
||||
<div className="GameButton__player-data GameButton__player-data--black">
|
||||
<span className="GameButton__player-data__name GameButton__player-data__name--black">{game.playerBlack}</span>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import React, { useState, useEffect } from 'react';
|
||||
import React, { useState } from 'react';
|
||||
import './Signup.scss';
|
||||
import authServices from '../../../services/authServices';
|
||||
import FormError from '../../Error/FormError/FormError';
|
||||
|
@ -22,7 +22,7 @@ const Signup = (props) => {
|
|||
})
|
||||
}
|
||||
|
||||
if (password.length < 8) {
|
||||
if (password.length < minimumPasswordLength) {
|
||||
return props.dispatch({
|
||||
...errorDispatchAction,
|
||||
body: { authError: 'Password must be at least 8 characters'}
|
||||
|
|
|
@ -3,7 +3,7 @@ import './Board.scss';
|
|||
import Point from '../Point/Point';
|
||||
|
||||
const Board = (props) => {
|
||||
const { game, record, user, dispatch, board } = props;
|
||||
const { game, user, dispatch, board } = props;
|
||||
const sizeFlag = `Game__board--size-${ game.boardSize }`
|
||||
|
||||
const renderPoints = boardSize => {
|
||||
|
@ -20,6 +20,7 @@ const Board = (props) => {
|
|||
pointData={board[`${posX}-${posY}`]}
|
||||
// point={board[posX][posY]}
|
||||
dispatch={dispatch}
|
||||
user={user}
|
||||
{...props}
|
||||
/>
|
||||
); i++;
|
||||
|
|
|
@ -2,7 +2,7 @@ import React from 'react';
|
|||
import './Point.scss';
|
||||
|
||||
const Point = (props) => {
|
||||
const { posX, posY, user, game, record, dispatch, pointData } = props;
|
||||
const { posX, posY, user, game, dispatch, pointData } = props;
|
||||
const turn = game.turn > 0 ? 'black' : 'white';
|
||||
|
||||
const stone = () => {
|
||||
|
|
|
@ -1,7 +1,5 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
import React, { useEffect } from 'react';
|
||||
import { useParams } from 'react-router-dom';
|
||||
import socketIOClient from 'socket.io-client';
|
||||
import config from '../../config';
|
||||
import gamesServices from '../../services/api/gamesServices';
|
||||
import './Game.scss';
|
||||
import Logo from '../../components/Display/Logo/Logo';
|
||||
|
@ -12,36 +10,37 @@ const Game = (props) => {
|
|||
const { state, dispatch } = props;
|
||||
const gameId = parseInt(useParams().id) || 0;
|
||||
|
||||
const fetchGameAPI = async () => {
|
||||
const response = await gamesServices.getGameService(gameId);
|
||||
if (response) {
|
||||
|
||||
useEffect(() => {
|
||||
const fetchGameAPI = async () => {
|
||||
const response = await gamesServices.getGameService(gameId);
|
||||
if (response) {
|
||||
const action = {
|
||||
type: 'GAMES',
|
||||
message: 'SET_ACTIVE',
|
||||
body: response
|
||||
}
|
||||
return dispatch(action);
|
||||
}
|
||||
}
|
||||
fetchGameAPI();
|
||||
}, [ gameId ])
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
const roomSocketConnect = () => {
|
||||
const game = state.active.game;
|
||||
const user = state.user;
|
||||
const action = {
|
||||
type: 'GAMES',
|
||||
message: 'SET_ACTIVE',
|
||||
body: response
|
||||
type: 'SOCKET',
|
||||
message: 'CONNECT_GAME',
|
||||
body: { game, user, dispatch }
|
||||
}
|
||||
return dispatch(action);
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
fetchGameAPI();
|
||||
}, [])
|
||||
|
||||
const roomSocketConnect = () => {
|
||||
const game = state.active.game;
|
||||
const user = state.user;
|
||||
const action = {
|
||||
type: 'SOCKET',
|
||||
message: 'CONNECT_GAME',
|
||||
body: { game, user, dispatch }
|
||||
}
|
||||
return dispatch(action);
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
roomSocketConnect();
|
||||
}, [state.active] )
|
||||
}, [ state.active ] )
|
||||
|
||||
return (
|
||||
<div
|
||||
className="Game"
|
||||
|
|
|
@ -23,19 +23,19 @@ const Home = props => {
|
|||
return <Loading />
|
||||
}
|
||||
|
||||
const fetchRoomsAPI = async () => {
|
||||
const response = await roomsServices.indexService();
|
||||
if (response) {
|
||||
const action = {
|
||||
type: 'ROOMS',
|
||||
message: 'SET_ROOMS',
|
||||
body: response.rooms
|
||||
}
|
||||
return dispatch(action)
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
const fetchRoomsAPI = async () => {
|
||||
const response = await roomsServices.indexService();
|
||||
if (response) {
|
||||
const action = {
|
||||
type: 'ROOMS',
|
||||
message: 'SET_ROOMS',
|
||||
body: response.rooms
|
||||
}
|
||||
return dispatch(action)
|
||||
}
|
||||
}
|
||||
fetchRoomsAPI();
|
||||
}, [])
|
||||
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import React, { useState } from 'react';
|
||||
import React from 'react';
|
||||
|
||||
import Auth from '../../components/Form/Auth/Auth';
|
||||
import NewRoomButton from '../../components/Button/NewRoom/NewRoom';
|
||||
|
@ -14,7 +14,7 @@ const HomeSidebar = (props) => {
|
|||
<LibraryButton />
|
||||
</>
|
||||
|
||||
const ifNoUser = <Auth state={state} dispatch={state} />
|
||||
const ifNoUser = <Auth state={state} dispatch={dispatch} />
|
||||
|
||||
return (
|
||||
<nav>
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import React, { useState } from 'react';
|
||||
import React from 'react';
|
||||
import './MainWrapper.scss';
|
||||
|
||||
import NavBar from '../NavBar/NavBar';
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import React, { useState } from 'react';
|
||||
import React from 'react';
|
||||
import './Sidebar.scss';
|
||||
|
||||
import AccountSidebar from '../../Account/AccountSidebar';
|
||||
|
|
|
@ -15,38 +15,33 @@ const Room = (props) => {
|
|||
const { state, dispatch } = props;
|
||||
const roomId = parseInt(useParams().id) || 0;
|
||||
|
||||
const fetchRoomAPI = async () => {
|
||||
const response = await roomsServices.getRoomService(roomId);
|
||||
if (response) {
|
||||
const action = {
|
||||
type: 'ROOMS',
|
||||
message: 'JOIN_ROOM',
|
||||
body: response
|
||||
}
|
||||
return dispatch(action);
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
fetchRoomAPI();
|
||||
}, [])
|
||||
|
||||
// ! [start] roomSocket
|
||||
|
||||
const roomSocketConnect = () => {
|
||||
const action = {
|
||||
type: 'SOCKET',
|
||||
message: 'CONNECT_ROOM',
|
||||
body: {user: state.user, room: roomId, dispatch}
|
||||
const fetchRoomAPI = async () => {
|
||||
const response = await roomsServices.getRoomService(roomId);
|
||||
if (response) {
|
||||
const action = {
|
||||
type: 'ROOMS',
|
||||
message: 'JOIN_ROOM',
|
||||
body: response
|
||||
}
|
||||
return dispatch(action);
|
||||
}
|
||||
}
|
||||
dispatch(action)
|
||||
}
|
||||
fetchRoomAPI();
|
||||
}, [ roomId ])
|
||||
|
||||
useEffect(() => {
|
||||
const roomSocketConnect = () => {
|
||||
const action = {
|
||||
type: 'SOCKET',
|
||||
message: 'CONNECT_ROOM',
|
||||
body: {user: state.user, room: roomId, dispatch}
|
||||
}
|
||||
dispatch(action)
|
||||
}
|
||||
roomSocketConnect();
|
||||
}, [])
|
||||
|
||||
// ! [end]
|
||||
}, [ roomId, state.user ])
|
||||
|
||||
const renderGames = () => {
|
||||
const games = state.games || [];
|
||||
|
|
Loading…
Reference in a new issue