From 46cebebfe6f8b9acf2b6169f0ba621a9810c7f03 Mon Sep 17 00:00:00 2001 From: khalska Date: Tue, 6 Jun 2017 10:41:44 +0200 Subject: [PATCH 01/18] Add login page. --- src/actions/auth.js | 93 +++++++++++++++++++++++++ src/components/Header/Header.js | 28 +++++++- src/components/LoginPage/LoginPage.js | 83 ++++++++++++++++++++++ src/components/LoginPage/LoginPage.scss | 3 + src/components/Page/Page.js | 20 +++++- src/reducers/auth.js | 29 ++++++++ src/reducers/index.js | 7 +- src/routes.js | 2 + 8 files changed, 260 insertions(+), 5 deletions(-) create mode 100644 src/actions/auth.js create mode 100644 src/components/LoginPage/LoginPage.js create mode 100644 src/components/LoginPage/LoginPage.scss create mode 100644 src/reducers/auth.js diff --git a/src/actions/auth.js b/src/actions/auth.js new file mode 100644 index 0000000..862e74a --- /dev/null +++ b/src/actions/auth.js @@ -0,0 +1,93 @@ +export function setIsLogged(isLogged) { + return { + type: 'SET_IS_LOGING', + isLogged + }; +} + +export function setLogin(login) { + return { + type: 'SET_LOGIN', + login + }; +} + +export function setToken(token) { + return { + type: 'SET_TOKEN', + token + }; +} + +export function signIn(login, password) { + return (dispatch) => { + + dispatch(fetchSignIn(login,password)); + } +} + +export function fetchSignIn(login, password) { + return (dispatch, getState) => { + const data = { + login, + password + } + + const myParams = Object.keys(data).map((key) => { + return encodeURIComponent(key) + '=' + encodeURIComponent(data[key]); + }).join('&'); + + const fetchData = { + method: 'POST', + body: myParams, + //credentials: 'include', + headers: { + //"Content-Type": "application/json" + 'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8', + 'Access-Control-Allow-Origin': 'http://localhost:3003' + } + } + + const url = 'http://localhost:3003/auth/login'; + + fetch(url, fetchData) + .then((response) => { + + if (!response.ok) { + throw Error(response.statusText); + } + return response; + }) + .then( (response) => response.json() ) + .then( (json) => { + dispatch(setToken(json.token)); + dispatch(setIsLogged(true)); + dispatch(setLogin(login)); + }); + + } +} + +// export function postsFetchData(url) { +// return (dispatch) => { +// dispatch(postsIsLoading(true)); +// +// fetch(url) +// .then((response) => { +// +// if (!response.ok) { +// throw Error(response.statusText); +// } +// +// dispatch(postsIsLoading(false)); +// return response; +// }) +// .then((response) => response.json()) +// .then((posts) => { +// dispatch(setPosts(posts)) +// dispatch(postsFilter(posts)) +// dispatch({ type: 'SET_LAST_POST_ID', lastPostId: 100 }) +// }) +// .catch(() => dispatch(postsHasErrored(true))); +// }; +// } \ No newline at end of file diff --git a/src/components/Header/Header.js b/src/components/Header/Header.js index f776590..83b0315 100755 --- a/src/components/Header/Header.js +++ b/src/components/Header/Header.js @@ -4,10 +4,16 @@ import Logo from '../Logo/Logo'; import PropTypes from 'prop-types'; import logo from './logo.svg'; import classNames from 'classnames'; +import { connect } from "react-redux"; +import { + signIn +} from '../../actions/auth'; class Header extends React.Component { static propTypes = { - title: PropTypes.string.isRequired + title: PropTypes.string.isRequired, + isLogged: PropTypes.bool.isRequired, + login: PropTypes.string } render() { return ( @@ -19,4 +25,22 @@ class Header extends React.Component { ); } } -export default Header; +//export default Header; + +const mapStateToProps = (state) => { + return { + isLogged: state.isLogged, + login: state.login + }; +} + +const mapDispatchToProps = (dispatch) => { + return { + login: (login) => dispatch(signIn(login)) + }; +} + +export default connect( + mapStateToProps, + mapDispatchToProps +)(Header); \ No newline at end of file diff --git a/src/components/LoginPage/LoginPage.js b/src/components/LoginPage/LoginPage.js new file mode 100644 index 0000000..5347853 --- /dev/null +++ b/src/components/LoginPage/LoginPage.js @@ -0,0 +1,83 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import classNames from 'classnames'; +import './LoginPage.css'; +import { connect } from "react-redux"; +import { + signIn, + setLogin +} from '../../actions/auth'; +import { browserHistory } from 'react-router'; + + +class LoginPage extends React.Component { + constructor(props){ + super(props); + this.state={ + login: '', + password: '' + } + } + + static propTypes = { + isLogged: PropTypes.bool.isRequired, + login: PropTypes.string + } + + onChangeLogin() { + + } + + onHandleButton() { + console.log('a') + this.props.signIn(this.state.login, this.state.password); + browserHistory.push('/'); + //this.props.history.push('/some/path'); + } + + render() { + return ( +
+

Login:

+ + login: {this.props.login} + +
+ this.setState({login: event.target.value}) } + /> +
+ this.setState({password: event.target.value}) } + /> +
+ + +
+ luannhayes@qualitern.com + +
+ ); + } +} +//export default LoginPage; + +const mapStateToProps = (state) => { + return { + isLogged: state.isLogged, + login: state.login + }; +} + +const mapDispatchToProps = (dispatch) => { + return { + signIn: (login, password) => dispatch(signIn(login, password)) + }; +} + +export default connect( + mapStateToProps, + mapDispatchToProps +)(LoginPage); diff --git a/src/components/LoginPage/LoginPage.scss b/src/components/LoginPage/LoginPage.scss new file mode 100644 index 0000000..0737055 --- /dev/null +++ b/src/components/LoginPage/LoginPage.scss @@ -0,0 +1,3 @@ +.LoginPage{ + +} \ No newline at end of file diff --git a/src/components/Page/Page.js b/src/components/Page/Page.js index a90711f..26c89e0 100755 --- a/src/components/Page/Page.js +++ b/src/components/Page/Page.js @@ -32,7 +32,10 @@ class Page extends React.Component { changePhrase: PropTypes.func.isRequired, getSearchedPosts: PropTypes.func.isRequired, setPostToDelete: PropTypes.func.isRequired, - deletePost: PropTypes.func.isRequired + deletePost: PropTypes.func.isRequired, + + isLogged: PropTypes.bool.isRequired, + login: PropTypes.string } constructor(props) { @@ -103,9 +106,19 @@ class Page extends React.Component { {this.__renderAddPostButton()} + + + Zaloguj + +
post to delete: {this.props.postToDelete} , number of posts: {this.props.posts.length}
- searhced phrase:{ searchedPhrase } + +
+ login: {this.props.login} + +
+ { hasErrored: state.postsHasErrored, isLoading: state.postsIsLoading, postToDelete: state.postToDelete, + + isLogged: state.isLogged, + login: state.login }; } diff --git a/src/reducers/auth.js b/src/reducers/auth.js new file mode 100644 index 0000000..ecbac6b --- /dev/null +++ b/src/reducers/auth.js @@ -0,0 +1,29 @@ +export function isLogged(state = false, action) { + switch (action.type) { + case 'SET_IS_LOGGED': + return action.isLogged; + + default: + return state; + } +} + +export function login(state = '', action) { + switch (action.type) { + case 'SET_LOGIN': + return action.login; + + default: + return state; + } +} + +export function token(state = '', action) { + switch (action.type) { + case 'SET_TOKEN': + return action.token; + + default: + return state; + } +} \ No newline at end of file diff --git a/src/reducers/index.js b/src/reducers/index.js index 6c35819..20fd867 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -1,6 +1,7 @@ import { combineReducers } from 'redux'; import { posts, postsHasErrored, postsIsLoading, searchedPhrase, filteredPosts, postToDelete } from './posts'; import { inputTitleValue, textareaBodyValue, userValue, comments, lastPostId } from './postPage'; +import { isLogged, login, token } from './auth'; export default combineReducers({ posts, @@ -13,5 +14,9 @@ export default combineReducers({ textareaBodyValue, userValue, comments, - lastPostId + lastPostId, + + isLogged, + login, + token }); diff --git a/src/routes.js b/src/routes.js index 97955aa..de1d146 100644 --- a/src/routes.js +++ b/src/routes.js @@ -2,6 +2,7 @@ import React from 'react'; import { Router, Route, browserHistory } from 'react-router'; import Page from "./components/Page/Page"; import PostPage from "./components/PostPage/PostPage"; +import LoginPage from "./components/LoginPage/LoginPage"; export default () => { return ( @@ -9,6 +10,7 @@ export default () => { + ); }; From 4c618b7bf92aa404e70d48dfe50d882e9c2a5a5b Mon Sep 17 00:00:00 2001 From: khalska Date: Tue, 6 Jun 2017 10:49:20 +0200 Subject: [PATCH 02/18] Fix linter errors. --- src/actions/actions.js | 1 + src/actions/postPage.js | 7 ++++--- src/components/Header/Header.js | 2 +- src/components/LoginPage/LoginPage.js | 7 +++---- src/components/Page/Page.js | 2 +- src/components/PostPage/PostPage.js | 1 - 6 files changed, 10 insertions(+), 10 deletions(-) diff --git a/src/actions/actions.js b/src/actions/actions.js index 2ea7e40..4b9b3cc 100644 --- a/src/actions/actions.js +++ b/src/actions/actions.js @@ -68,6 +68,7 @@ export function getFilteredPosts() { const body = post.body.toLowerCase(); return (title.indexOf(searchedPhrase) >= 0 || body.indexOf(searchedPhrase) >= 0); } + else return false; }); } diff --git a/src/actions/postPage.js b/src/actions/postPage.js index 4c34f18..0990fb6 100644 --- a/src/actions/postPage.js +++ b/src/actions/postPage.js @@ -138,13 +138,14 @@ export function updatePost(postId) { .then( (response) => { let posts = getState().posts; - posts = posts.filter( (post) => { - if (post.id == postId) { + posts.filter( (post) => { + if (post.id === postId) { post.title = fetchData.body.title; post.body = fetchData.body.body; - post.userId = fetchData.body.userId + post.userId = fetchData.body.userId; return true; } + else return false; }); //const info = (response.ok) ? 'Changes in post was saved.' : 'Error!' //this.setState({info}) diff --git a/src/components/Header/Header.js b/src/components/Header/Header.js index 83b0315..01efdfa 100755 --- a/src/components/Header/Header.js +++ b/src/components/Header/Header.js @@ -36,7 +36,7 @@ const mapStateToProps = (state) => { const mapDispatchToProps = (dispatch) => { return { - login: (login) => dispatch(signIn(login)) + signIn: (login) => dispatch(signIn(login)) }; } diff --git a/src/components/LoginPage/LoginPage.js b/src/components/LoginPage/LoginPage.js index 5347853..ddc01cc 100644 --- a/src/components/LoginPage/LoginPage.js +++ b/src/components/LoginPage/LoginPage.js @@ -4,8 +4,7 @@ import classNames from 'classnames'; import './LoginPage.css'; import { connect } from "react-redux"; import { - signIn, - setLogin + signIn } from '../../actions/auth'; import { browserHistory } from 'react-router'; @@ -45,12 +44,12 @@ class LoginPage extends React.Component {
this.setState({login: event.target.value}) } + onChange={ (event) => this.setState({ login: event.target.value }) } />
this.setState({password: event.target.value}) } + onChange={ (event) => this.setState({ password: event.target.value }) } />
diff --git a/src/components/Page/Page.js b/src/components/Page/Page.js index 26c89e0..0fc92a0 100755 --- a/src/components/Page/Page.js +++ b/src/components/Page/Page.js @@ -46,7 +46,7 @@ class Page extends React.Component { } componentDidMount() { - if (this.props.posts.length == 0) { + if (this.props.posts.length === 0) { this.props.fetchData(config.url); } diff --git a/src/components/PostPage/PostPage.js b/src/components/PostPage/PostPage.js index 0c8770b..dccef06 100644 --- a/src/components/PostPage/PostPage.js +++ b/src/components/PostPage/PostPage.js @@ -6,7 +6,6 @@ import { config } from '../../config.js'; import Comment from '../Comment/Comment'; import User from '../User/User'; import './PostPage.css'; -import fetch from 'isomorphic-fetch'; import { IndexLink } from 'react-router' import {connect} from "react-redux"; import { From 52a6f1cb207a1332e5920eabed09804c22443f3b Mon Sep 17 00:00:00 2001 From: khalska Date: Tue, 6 Jun 2017 12:31:09 +0200 Subject: [PATCH 03/18] Get user data. --- src/actions/auth.js | 33 +++++++++++++ src/components/Page/Page.js | 11 +---- src/components/UserPanel/UserPanel.js | 66 +++++++++++++++++++++++++ src/components/UserPanel/UserPanel.scss | 0 src/reducers/auth.js | 10 ++++ src/reducers/index.js | 5 +- 6 files changed, 114 insertions(+), 11 deletions(-) create mode 100644 src/components/UserPanel/UserPanel.js create mode 100644 src/components/UserPanel/UserPanel.scss diff --git a/src/actions/auth.js b/src/actions/auth.js index 862e74a..8750212 100644 --- a/src/actions/auth.js +++ b/src/actions/auth.js @@ -19,6 +19,13 @@ export function setToken(token) { }; } +export function setUserData(userData) { + return { + type: 'SET_USER_DATA', + userData + }; +} + export function signIn(login, password) { return (dispatch) => { @@ -63,11 +70,37 @@ export function fetchSignIn(login, password) { dispatch(setToken(json.token)); dispatch(setIsLogged(true)); dispatch(setLogin(login)); + dispatch(fetchUserData(json.token)) }); } } +export function fetchUserData(token) { + return (dispatch) => { + const url = 'http://localhost:3003/auth/me'; + + const fetchData = { + method: 'GET', + headers: { + authorization: token, + }, + } + + fetch(url, fetchData) + .then((response) => { + if (!response.ok) { + throw Error(response.statusText); + } + return response; + }) + .then((response) => response.json()) + .then((json) => { + dispatch(setUserData(json)) + }); + }; +} + // export function postsFetchData(url) { // return (dispatch) => { // dispatch(postsIsLoading(true)); diff --git a/src/components/Page/Page.js b/src/components/Page/Page.js index 0fc92a0..a5198f1 100755 --- a/src/components/Page/Page.js +++ b/src/components/Page/Page.js @@ -3,6 +3,7 @@ import { Link } from 'react-router'; import './Page.css'; import Post from '../Post/Post'; import Modal from '../Modal/Modal'; +import UserPanel from '../UserPanel/UserPanel'; import Search from '../Search/Search'; import { config } from '../../config.js'; import classNames from 'classnames'; @@ -103,20 +104,12 @@ class Page extends React.Component { return (
- + {this.__renderAddPostButton()} - - Zaloguj - -
post to delete: {this.props.postToDelete} , number of posts: {this.props.posts.length}
- -
- login: {this.props.login} -
+ + { this.props.userData.firstName } { this.props.userData.lastName } + ({ this.props.userData.email }) +
+ + + Zaloguj + + + this.props.getUserData()} + className={classNames('btn btn-default')}> + Wyloguj + + +
+ ); + } +} + +const mapStateToProps = (state) => { + return { + isLogged: state.isLogged, + login: state.login, + userData: state.userData + }; +} + +const mapDispatchToProps = (dispatch) => { + return { + getUserData: () => dispatch(fetchUserData()) + }; +} + +export default connect( + mapStateToProps, + mapDispatchToProps +)(UserPanel); diff --git a/src/components/UserPanel/UserPanel.scss b/src/components/UserPanel/UserPanel.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/reducers/auth.js b/src/reducers/auth.js index ecbac6b..68fd7ac 100644 --- a/src/reducers/auth.js +++ b/src/reducers/auth.js @@ -23,6 +23,16 @@ export function token(state = '', action) { case 'SET_TOKEN': return action.token; + default: + return state; + } +} + +export function userData(state = {}, action) { + switch (action.type) { + case 'SET_USER_DATA': + return action.userData; + default: return state; } diff --git a/src/reducers/index.js b/src/reducers/index.js index 20fd867..9ba3167 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -1,7 +1,7 @@ import { combineReducers } from 'redux'; import { posts, postsHasErrored, postsIsLoading, searchedPhrase, filteredPosts, postToDelete } from './posts'; import { inputTitleValue, textareaBodyValue, userValue, comments, lastPostId } from './postPage'; -import { isLogged, login, token } from './auth'; +import { isLogged, login, token, userData } from './auth'; export default combineReducers({ posts, @@ -18,5 +18,6 @@ export default combineReducers({ isLogged, login, - token + token, + userData }); From 2bb37ad5f87abad4d2f9016d4fbf85f8d73f4ad9 Mon Sep 17 00:00:00 2001 From: khalska Date: Tue, 6 Jun 2017 13:35:46 +0200 Subject: [PATCH 04/18] Visibility depends on user. --- src/actions/auth.js | 46 ++++++------------------ src/components/Header/Header.js | 7 ++-- src/components/Page/Page.js | 13 +++---- src/components/Post/Post.js | 50 +++++++++++++++++++-------- src/components/UserPanel/UserPanel.js | 38 ++++++++++++-------- src/reducers/auth.js | 10 ------ src/reducers/index.js | 3 +- 7 files changed, 80 insertions(+), 87 deletions(-) diff --git a/src/actions/auth.js b/src/actions/auth.js index 8750212..839299f 100644 --- a/src/actions/auth.js +++ b/src/actions/auth.js @@ -1,14 +1,8 @@ -export function setIsLogged(isLogged) { - return { - type: 'SET_IS_LOGING', - isLogged - }; -} +export function setIsLogged(bool) { -export function setLogin(login) { return { - type: 'SET_LOGIN', - login + type: 'SET_IS_LOGGED', + isLogged: bool }; } @@ -28,7 +22,6 @@ export function setUserData(userData) { export function signIn(login, password) { return (dispatch) => { - dispatch(fetchSignIn(login,password)); } } @@ -69,8 +62,7 @@ export function fetchSignIn(login, password) { .then( (json) => { dispatch(setToken(json.token)); dispatch(setIsLogged(true)); - dispatch(setLogin(login)); - dispatch(fetchUserData(json.token)) + dispatch(fetchUserData(json.token)); }); } @@ -101,26 +93,10 @@ export function fetchUserData(token) { }; } -// export function postsFetchData(url) { -// return (dispatch) => { -// dispatch(postsIsLoading(true)); -// -// fetch(url) -// .then((response) => { -// -// if (!response.ok) { -// throw Error(response.statusText); -// } -// -// dispatch(postsIsLoading(false)); -// return response; -// }) -// .then((response) => response.json()) -// .then((posts) => { -// dispatch(setPosts(posts)) -// dispatch(postsFilter(posts)) -// dispatch({ type: 'SET_LAST_POST_ID', lastPostId: 100 }) -// }) -// .catch(() => dispatch(postsHasErrored(true))); -// }; -// } \ No newline at end of file +export function logOut() { + return (dispatch) => { + dispatch(setToken('')); + dispatch(setIsLogged(false)); + dispatch(setUserData({})); + } +} diff --git a/src/components/Header/Header.js b/src/components/Header/Header.js index 01efdfa..c197127 100755 --- a/src/components/Header/Header.js +++ b/src/components/Header/Header.js @@ -5,6 +5,7 @@ import PropTypes from 'prop-types'; import logo from './logo.svg'; import classNames from 'classnames'; import { connect } from "react-redux"; +import UserPanel from '../UserPanel/UserPanel'; import { signIn } from '../../actions/auth'; @@ -13,13 +14,14 @@ class Header extends React.Component { static propTypes = { title: PropTypes.string.isRequired, isLogged: PropTypes.bool.isRequired, - login: PropTypes.string } + render() { return (
-

{this.props.title}

+

{this.props.title}

+
); @@ -30,7 +32,6 @@ class Header extends React.Component { const mapStateToProps = (state) => { return { isLogged: state.isLogged, - login: state.login }; } diff --git a/src/components/Page/Page.js b/src/components/Page/Page.js index a5198f1..37d191b 100755 --- a/src/components/Page/Page.js +++ b/src/components/Page/Page.js @@ -3,7 +3,6 @@ import { Link } from 'react-router'; import './Page.css'; import Post from '../Post/Post'; import Modal from '../Modal/Modal'; -import UserPanel from '../UserPanel/UserPanel'; import Search from '../Search/Search'; import { config } from '../../config.js'; import classNames from 'classnames'; @@ -35,8 +34,7 @@ class Page extends React.Component { setPostToDelete: PropTypes.func.isRequired, deletePost: PropTypes.func.isRequired, - isLogged: PropTypes.bool.isRequired, - login: PropTypes.string + isLogged: PropTypes.bool.isRequired } constructor(props) { @@ -91,11 +89,13 @@ class Page extends React.Component { __renderAddPostButton() { return( + this.props.isLogged &&
- Add new post + Add new post
+ ); } @@ -104,8 +104,6 @@ class Page extends React.Component { return (
- - {this.__renderAddPostButton()}
post to delete: {this.props.postToDelete} , number of posts: {this.props.posts.length}
@@ -148,8 +146,7 @@ const mapStateToProps = (state) => { isLoading: state.postsIsLoading, postToDelete: state.postToDelete, - isLogged: state.isLogged, - login: state.login + isLogged: state.isLogged }; } diff --git a/src/components/Post/Post.js b/src/components/Post/Post.js index 77f9f91..9a97579 100755 --- a/src/components/Post/Post.js +++ b/src/components/Post/Post.js @@ -3,13 +3,15 @@ import { Link } from 'react-router'; import './Post.css'; import PropTypes from 'prop-types'; import classNames from 'classnames'; +import { connect } from "react-redux"; class Post extends React.Component { static propTypes = { id: PropTypes.number, title: PropTypes.string, body: PropTypes.string, - handleDelete: PropTypes.func.isRequired + handleDelete: PropTypes.func.isRequired, + isLogged: PropTypes.bool.isRequired } constructor(props) { @@ -24,20 +26,40 @@ class Post extends React.Component {

{this.props.title}

{this.props.body}
-
- - Edit - - -
+ { + this.props.isLogged && +
+ + Edit + + +
+ } ); } } -export default Post; +//export default Post; + +const mapStateToProps = (state) => { + return { + isLogged: state.isLogged + }; +} + +const mapDispatchToProps = (dispatch) => { + return { + + }; +} + +export default connect( + mapStateToProps, + mapDispatchToProps +)(Post); diff --git a/src/components/UserPanel/UserPanel.js b/src/components/UserPanel/UserPanel.js index 78b110b..fd6a661 100644 --- a/src/components/UserPanel/UserPanel.js +++ b/src/components/UserPanel/UserPanel.js @@ -5,16 +5,14 @@ import PropTypes from 'prop-types'; import classNames from 'classnames'; import { connect } from "react-redux"; import { - fetchUserData + logOut } from '../../actions/auth'; class UserPanel extends React.Component { static propTypes = { isLogged: PropTypes.bool.isRequired, - login: PropTypes.string, userData: PropTypes.object, - getUserData: PropTypes.func, - + logOut: PropTypes.func } constructor(props) { @@ -22,25 +20,36 @@ class UserPanel extends React.Component { this.state = { isModalOpen: false } } - render() { - return ( -
+ __renderUserData() { + return( +
{ this.props.userData.firstName } { this.props.userData.lastName } ({ this.props.userData.email })
- - Zaloguj - - this.props.getUserData()} + onClick={() => this.props.logOut()} className={classNames('btn btn-default')}> - Wyloguj + Log out +
+ ) + } + render() { + return ( +
+ { + this.props.isLogged && + this.__renderUserData() + } + { !this.props.isLogged && + + Log in + + }
); } @@ -49,14 +58,13 @@ class UserPanel extends React.Component { const mapStateToProps = (state) => { return { isLogged: state.isLogged, - login: state.login, userData: state.userData }; } const mapDispatchToProps = (dispatch) => { return { - getUserData: () => dispatch(fetchUserData()) + logOut: () => dispatch(logOut()) }; } diff --git a/src/reducers/auth.js b/src/reducers/auth.js index 68fd7ac..928cbe5 100644 --- a/src/reducers/auth.js +++ b/src/reducers/auth.js @@ -8,16 +8,6 @@ export function isLogged(state = false, action) { } } -export function login(state = '', action) { - switch (action.type) { - case 'SET_LOGIN': - return action.login; - - default: - return state; - } -} - export function token(state = '', action) { switch (action.type) { case 'SET_TOKEN': diff --git a/src/reducers/index.js b/src/reducers/index.js index 9ba3167..8a43400 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -1,7 +1,7 @@ import { combineReducers } from 'redux'; import { posts, postsHasErrored, postsIsLoading, searchedPhrase, filteredPosts, postToDelete } from './posts'; import { inputTitleValue, textareaBodyValue, userValue, comments, lastPostId } from './postPage'; -import { isLogged, login, token, userData } from './auth'; +import { isLogged, token, userData } from './auth'; export default combineReducers({ posts, @@ -17,7 +17,6 @@ export default combineReducers({ lastPostId, isLogged, - login, token, userData }); From b2bf0e343a2125c45ff04c7862f8a037a866f6a7 Mon Sep 17 00:00:00 2001 From: khalska Date: Tue, 6 Jun 2017 13:58:38 +0200 Subject: [PATCH 05/18] Adding layout component to able router links in header. --- src/components/App/logo.svg | 7 --- .../{App/App.js => Layout/Layout.js} | 12 ++-- .../{App/App.scss => Layout/Layout.scss} | 0 src/components/LoginPage/LoginPage.js | 40 +++++++------- src/components/Page/Page.js | 55 ++++++++++--------- src/components/PostPage/PostPage.js | 17 +++--- src/index.js | 8 +-- 7 files changed, 71 insertions(+), 68 deletions(-) delete mode 100755 src/components/App/logo.svg rename src/components/{App/App.js => Layout/Layout.js} (57%) rename src/components/{App/App.scss => Layout/Layout.scss} (100%) diff --git a/src/components/App/logo.svg b/src/components/App/logo.svg deleted file mode 100755 index 6b60c10..0000000 --- a/src/components/App/logo.svg +++ /dev/null @@ -1,7 +0,0 @@ - - - - - - - diff --git a/src/components/App/App.js b/src/components/Layout/Layout.js similarity index 57% rename from src/components/App/App.js rename to src/components/Layout/Layout.js index f315898..cde84ff 100644 --- a/src/components/App/App.js +++ b/src/components/Layout/Layout.js @@ -1,17 +1,21 @@ import React from 'react'; +import PropTypes from 'prop-types'; import Header from '../Header/Header'; import Footer from '../Footer/Footer'; -import getRoutes from '../../routes'; -class App extends React.Component { +class Layout extends React.Component { + static propTypes = { + children: PropTypes.node + } + render() { return (
- { getRoutes() } + { this.props.children }
); } } -export default App; +export default Layout; diff --git a/src/components/App/App.scss b/src/components/Layout/Layout.scss similarity index 100% rename from src/components/App/App.scss rename to src/components/Layout/Layout.scss diff --git a/src/components/LoginPage/LoginPage.js b/src/components/LoginPage/LoginPage.js index ddc01cc..493e0b3 100644 --- a/src/components/LoginPage/LoginPage.js +++ b/src/components/LoginPage/LoginPage.js @@ -7,6 +7,7 @@ import { signIn } from '../../actions/auth'; import { browserHistory } from 'react-router'; +import Layout from "../Layout/Layout"; class LoginPage extends React.Component { @@ -36,28 +37,29 @@ class LoginPage extends React.Component { render() { return ( -
-

Login:

+ +
+

Login:

- login: {this.props.login} + login: {this.props.login} -
- this.setState({ login: event.target.value }) } - /> -
- this.setState({ password: event.target.value }) } - /> -
- +
+ this.setState({ login: event.target.value }) } + /> +
+ this.setState({ password: event.target.value }) } + /> +
+ -
- luannhayes@qualitern.com - -
+
+ luannhayes@qualitern.com +
+ ); } } diff --git a/src/components/Page/Page.js b/src/components/Page/Page.js index 37d191b..9a1e92d 100755 --- a/src/components/Page/Page.js +++ b/src/components/Page/Page.js @@ -3,6 +3,7 @@ import { Link } from 'react-router'; import './Page.css'; import Post from '../Post/Post'; import Modal from '../Modal/Modal'; +import Layout from '../Layout/Layout'; import Search from '../Search/Search'; import { config } from '../../config.js'; import classNames from 'classnames'; @@ -103,32 +104,34 @@ class Page extends React.Component { const { searchedPhrase, getSearchedPosts, changePhrase } = this.props; return ( -
- {this.__renderAddPostButton()} - -
post to delete: {this.props.postToDelete} , number of posts: {this.props.posts.length}
- -
- - debounce(500, changePhrase(e)) } - onFilterTextButton={ (e) => getSearchedPosts(e) } - /> - - this.closeModal() } - onConfirm={ () => this.onConfirmDelete(this.props.postToDelete) } - buttonCloseLabel="No" - buttonConfirmLabel="Yes" - > -

Are you sure to delete post #{this.props.postToDelete}?

- - - {this.__renderPosts()} -
+ +
+ {this.__renderAddPostButton()} + +
post to delete: {this.props.postToDelete} , number of posts: {this.props.posts.length}
+ +
+ + debounce(500, changePhrase(e)) } + onFilterTextButton={ (e) => getSearchedPosts(e) } + /> + + this.closeModal() } + onConfirm={ () => this.onConfirmDelete(this.props.postToDelete) } + buttonCloseLabel="No" + buttonConfirmLabel="Yes" + > +

Are you sure to delete post #{this.props.postToDelete}?

+ + + {this.__renderPosts()} +
+ ); } } diff --git a/src/components/PostPage/PostPage.js b/src/components/PostPage/PostPage.js index dccef06..bbac5f3 100644 --- a/src/components/PostPage/PostPage.js +++ b/src/components/PostPage/PostPage.js @@ -17,6 +17,7 @@ import { addPost, updatePost } from '../../actions/postPage'; +import Layout from "../Layout/Layout"; class PostPage extends React.Component { static propTypes = { @@ -175,13 +176,15 @@ class PostPage extends React.Component { render() { return ( -
- {this.__renderBreadcrumbs()} - {this.__renderTitle()} - {this.__renderForm()} - {this.__renderInfo()} - {this.__renderComments()} -
+ +
+ {this.__renderBreadcrumbs()} + {this.__renderTitle()} + {this.__renderForm()} + {this.__renderInfo()} + {this.__renderComments()} +
+ ); } } diff --git a/src/index.js b/src/index.js index 68d620f..f1304f9 100755 --- a/src/index.js +++ b/src/index.js @@ -2,11 +2,10 @@ import 'bootstrap/dist/css/bootstrap.css'; import 'bootstrap/dist/css/bootstrap-theme.css'; import React from 'react'; import ReactDOM from 'react-dom'; -import App from './components/App/App'; import './style/index.css'; import {Provider} from "react-redux"; import configureStore from './store/configureStore'; - +import getRoutes from './routes'; const initialState = { posts: [], @@ -19,9 +18,8 @@ const store = configureStore(initialState); ReactDOM.render(( -
- - +
+ { getRoutes() }
), document.getElementById('root')); From 7a245e7a71e4bd38cf3c1f9ee645ae8fae8f70aa Mon Sep 17 00:00:00 2001 From: khalska Date: Tue, 6 Jun 2017 15:05:34 +0200 Subject: [PATCH 06/18] Getting user from API. --- src/actions/postPage.js | 34 +++++++++++++++++++++++++ src/components/LoginPage/LoginPage.js | 5 ++-- src/components/PostPage/PostPage.js | 16 ++++++++---- src/components/User/User.js | 36 +++++++++++++++++++++++---- src/reducers/index.js | 5 ++-- src/reducers/postPage.js | 10 ++++++++ 6 files changed, 92 insertions(+), 14 deletions(-) diff --git a/src/actions/postPage.js b/src/actions/postPage.js index 0990fb6..5354e17 100644 --- a/src/actions/postPage.js +++ b/src/actions/postPage.js @@ -152,3 +152,37 @@ export function updatePost(postId) { }); } } + +export function setUsers(users) { + return { + type: 'SET_USERS', + users + } +} + +export function fetchUsers() { + return (dispatch, getState) => { + const url = 'http://localhost:3003/authors'; + const token = getState().token; + + const fetchData = { + method: 'GET', + headers: { + authorization: token, + }, + } + + fetch(url, fetchData) + .then((response) => { + if (!response.ok) { + throw Error(response.statusText); + } + return response; + }) + .then((response) => response.json()) + .then((json) => { + dispatch(setUsers(json)); + console.log(getState().users) + }); + }; +} diff --git a/src/components/LoginPage/LoginPage.js b/src/components/LoginPage/LoginPage.js index 493e0b3..9b548e9 100644 --- a/src/components/LoginPage/LoginPage.js +++ b/src/components/LoginPage/LoginPage.js @@ -30,7 +30,8 @@ class LoginPage extends React.Component { onHandleButton() { console.log('a') - this.props.signIn(this.state.login, this.state.password); + this.props.signIn('luannhayes@qualitern.com', 'lesa'); + // this.props.signIn(this.state.login, this.state.password); browserHistory.push('/'); //this.props.history.push('/some/path'); } @@ -57,7 +58,7 @@ class LoginPage extends React.Component {
- luannhayes@qualitern.com +
); diff --git a/src/components/PostPage/PostPage.js b/src/components/PostPage/PostPage.js index bbac5f3..8dfeea8 100644 --- a/src/components/PostPage/PostPage.js +++ b/src/components/PostPage/PostPage.js @@ -15,7 +15,8 @@ import { getPostData, getPostComments, addPost, - updatePost + updatePost, + fetchUsers } from '../../actions/postPage'; import Layout from "../Layout/Layout"; @@ -34,7 +35,9 @@ class PostPage extends React.Component { getPostData: PropTypes.func.isRequired, getPostComments: PropTypes.func.isRequired, addPost: PropTypes.func.isRequired, - updatePost: PropTypes.func.isRequired + updatePost: PropTypes.func.isRequired, + getUsers: PropTypes.func.isRequired, + users: PropTypes.array.isRequired } constructor(props) { @@ -47,6 +50,7 @@ class PostPage extends React.Component { componentDidMount() { const postId = this.props.params.postId; + this.props.getUsers(); if (postId) { this.props.getPostData(postId); @@ -96,7 +100,7 @@ class PostPage extends React.Component {
User
    this.handleUserChange(e)} > - {config.users.map( + {this.props.users.map( user => )}
@@ -193,7 +197,8 @@ const mapStateToProps = (state) => { inputTitleValue: state.inputTitleValue, textareaBodyValue: state.textareaBodyValue, userValue: state.userValue, - comments: state.comments + comments: state.comments, + users: state.users }; } @@ -205,7 +210,8 @@ const mapDispatchToProps = (dispatch) => { getPostData: (postId) => dispatch(getPostData(postId)), getPostComments: (postId) => dispatch(getPostComments(postId)), addPost: () => dispatch(addPost()), - updatePost: (postId) => dispatch(updatePost(postId)) + updatePost: (postId) => dispatch(updatePost(postId)), + getUsers: () => dispatch(fetchUsers()) }; } diff --git a/src/components/User/User.js b/src/components/User/User.js index f44c645..b8c2ca5 100644 --- a/src/components/User/User.js +++ b/src/components/User/User.js @@ -1,20 +1,46 @@ import React from 'react'; import './User.css'; import PropTypes from 'prop-types'; +import { connect } from "react-redux"; +import classNames from 'classnames'; class User extends React.Component { static propTypes = { name: PropTypes.string, - id: PropTypes.number.isRequired + id: PropTypes.number.isRequired, + userData: PropTypes.node } render() { return ( -
  • - - +
  • + +
    • ); } } -export default User; + +const mapStateToProps = (state) => { + return { + userData: state.userData + }; +} + +const mapDispatchToProps = (dispatch) => { + return { + + }; +} + +export default connect( + mapStateToProps, + mapDispatchToProps +)(User); diff --git a/src/reducers/index.js b/src/reducers/index.js index 8a43400..807ef16 100644 --- a/src/reducers/index.js +++ b/src/reducers/index.js @@ -1,6 +1,6 @@ import { combineReducers } from 'redux'; import { posts, postsHasErrored, postsIsLoading, searchedPhrase, filteredPosts, postToDelete } from './posts'; -import { inputTitleValue, textareaBodyValue, userValue, comments, lastPostId } from './postPage'; +import { inputTitleValue, textareaBodyValue, userValue, comments, lastPostId, users } from './postPage'; import { isLogged, token, userData } from './auth'; export default combineReducers({ @@ -18,5 +18,6 @@ export default combineReducers({ isLogged, token, - userData + userData, + users }); diff --git a/src/reducers/postPage.js b/src/reducers/postPage.js index 14325fb..0770a59 100644 --- a/src/reducers/postPage.js +++ b/src/reducers/postPage.js @@ -55,3 +55,13 @@ export function lastPostId(state = -1, action) { } } +export function users(state = [], action) { + switch (action.type) { + case 'SET_USERS': + return action.users; + + default: + return state; + } +} + From 46dee0dfabd6ff9575276943a8953431661680bc Mon Sep 17 00:00:00 2001 From: khalska Date: Tue, 6 Jun 2017 15:34:04 +0200 Subject: [PATCH 07/18] Check posts of actual user. --- src/components/Post/Post.js | 11 +++++++---- src/components/Post/Post.scss | 3 +++ src/components/PostPage/PostPage.js | 2 +- src/components/PostPage/PostPage.scss | 1 + src/components/User/User.js | 8 ++++---- src/components/User/User.scss | 1 + 6 files changed, 17 insertions(+), 9 deletions(-) diff --git a/src/components/Post/Post.js b/src/components/Post/Post.js index 9a97579..5cb643d 100755 --- a/src/components/Post/Post.js +++ b/src/components/Post/Post.js @@ -11,7 +11,8 @@ class Post extends React.Component { title: PropTypes.string, body: PropTypes.string, handleDelete: PropTypes.func.isRequired, - isLogged: PropTypes.bool.isRequired + isLogged: PropTypes.bool.isRequired, + myId: PropTypes.number } constructor(props) { @@ -21,8 +22,9 @@ class Post extends React.Component { render() { return ( -
  • -
    +
  • +

    {this.props.title}

    {this.props.body}
    @@ -49,7 +51,8 @@ class Post extends React.Component { const mapStateToProps = (state) => { return { - isLogged: state.isLogged + isLogged: state.isLogged, + myId: state.userData.id }; } diff --git a/src/components/Post/Post.scss b/src/components/Post/Post.scss index f47aed4..6a99872 100755 --- a/src/components/Post/Post.scss +++ b/src/components/Post/Post.scss @@ -20,4 +20,7 @@ .Post_buttons{ } + &.Post--my-post{ + background: lightgrey; + } } \ No newline at end of file diff --git a/src/components/PostPage/PostPage.js b/src/components/PostPage/PostPage.js index 8dfeea8..5744222 100644 --- a/src/components/PostPage/PostPage.js +++ b/src/components/PostPage/PostPage.js @@ -99,7 +99,7 @@ class PostPage extends React.Component { return(
    User
    -
      this.handleUserChange(e)} > +
        this.handleUserChange(e)} > {this.props.users.map( user => )} diff --git a/src/components/PostPage/PostPage.scss b/src/components/PostPage/PostPage.scss index 6bac736..d881a84 100644 --- a/src/components/PostPage/PostPage.scss +++ b/src/components/PostPage/PostPage.scss @@ -31,6 +31,7 @@ &.users_container{ ul{ + margin: 0; padding: $padding; border: $baseBorder; list-style-type: none; diff --git a/src/components/User/User.js b/src/components/User/User.js index b8c2ca5..a2717e1 100644 --- a/src/components/User/User.js +++ b/src/components/User/User.js @@ -8,17 +8,17 @@ class User extends React.Component { static propTypes = { name: PropTypes.string, id: PropTypes.number.isRequired, - userData: PropTypes.node + myId: PropTypes.node } render() { return ( -
      • +
    + ); } } From 1dc772a227a68ba69ae999b16f24128489c1d338 Mon Sep 17 00:00:00 2001 From: khalska Date: Wed, 21 Jun 2017 10:06:42 +0200 Subject: [PATCH 16/18] Fixes to 4 PR --- src/actions/actions.js | 2 +- src/actions/auth.js | 2 +- src/components/LoginPage/LoginPage.js | 2 +- src/components/Post/Post.js | 6 ++++-- src/components/User/User.js | 8 +++++--- src/components/UserPanel/UserPanel.js | 12 +++++------- 6 files changed, 17 insertions(+), 15 deletions(-) diff --git a/src/actions/actions.js b/src/actions/actions.js index 0e6f9d5..f7953fe 100644 --- a/src/actions/actions.js +++ b/src/actions/actions.js @@ -92,7 +92,7 @@ export function deletePostAction(postId) { .then( () => { postId = getState().postToDelete; - let posts = getState().posts; + const posts = getState().posts; posts.forEach((item, index) => { if (item.id === postId) { diff --git a/src/actions/auth.js b/src/actions/auth.js index 8db04e2..73cd7d7 100644 --- a/src/actions/auth.js +++ b/src/actions/auth.js @@ -38,7 +38,7 @@ export function fetchSignIn(login, password) { } const myParams = Object.keys(data).map((key) => { - return encodeURIComponent(key) + '=' + encodeURIComponent(data[key]); + return `${encodeURIComponent(key)}=${encodeURIComponent(data[key])}`; }).join('&'); const fetchData = { diff --git a/src/components/LoginPage/LoginPage.js b/src/components/LoginPage/LoginPage.js index 7757799..819fb5c 100644 --- a/src/components/LoginPage/LoginPage.js +++ b/src/components/LoginPage/LoginPage.js @@ -35,7 +35,7 @@ class LoginPage extends React.Component {

    Log in

    - this.setState({ login: event.target.value }) } /> diff --git a/src/components/Post/Post.js b/src/components/Post/Post.js index d7b41e1..3c71f0d 100755 --- a/src/components/Post/Post.js +++ b/src/components/Post/Post.js @@ -12,7 +12,8 @@ class Post extends React.Component { body: PropTypes.string, handleDelete: PropTypes.func.isRequired, isLogged: PropTypes.bool.isRequired, - myId: PropTypes.number + myId: PropTypes.number, + userId: PropTypes.number } constructor(props) { @@ -23,7 +24,8 @@ class Post extends React.Component { render() { return (
  • + {'Post--my-post': this.props.userId === this.props.myId} + ) }>

    {this.props.title}

    {this.props.body}
    diff --git a/src/components/User/User.js b/src/components/User/User.js index 3001623..1358d20 100644 --- a/src/components/User/User.js +++ b/src/components/User/User.js @@ -8,12 +8,14 @@ class User extends React.Component { static propTypes = { name: PropTypes.string, id: PropTypes.number.isRequired, - myId: PropTypes.node + myId: PropTypes.node, + firstName: PropTypes.string, + lastName: PropTypes.string } render() { return ( -
  • +
    • ); diff --git a/src/components/UserPanel/UserPanel.js b/src/components/UserPanel/UserPanel.js index 4868ddf..cafd5ec 100644 --- a/src/components/UserPanel/UserPanel.js +++ b/src/components/UserPanel/UserPanel.js @@ -42,13 +42,11 @@ class UserPanel extends React.Component { return (
    { - this.props.isLogged && - this.__renderUserData() - } - { !this.props.isLogged && - - Sign in - + this.props.isLogged + ? this.__renderUserData() + : + Sign in + }
    ); From 6ce2fa5db655a4d9f57f2ee30b6dbafb568d6df3 Mon Sep 17 00:00:00 2001 From: khalska Date: Wed, 21 Jun 2017 11:28:02 +0200 Subject: [PATCH 17/18] Save token in localStorage - user will be logged in after refresh page --- src/actions/auth.js | 19 +++++++++++++++++++ src/actions/postPage.js | 1 + src/components/AuthComponent/AuthComponent.js | 14 +++++++++++--- src/components/LoginPage/LoginPage.js | 6 +++--- 4 files changed, 34 insertions(+), 6 deletions(-) diff --git a/src/actions/auth.js b/src/actions/auth.js index 73cd7d7..5da6799 100644 --- a/src/actions/auth.js +++ b/src/actions/auth.js @@ -2,6 +2,8 @@ import {config} from "../config"; import { validateLoginForm, setLoginFormValidation } from './validation.js'; +import { browserHistory } from 'react-router'; + export function setIsLogged(bool) { return { @@ -67,11 +69,26 @@ export function fetchSignIn(login, password) { dispatch(setToken(json.token)); dispatch(setIsLogged(true)); dispatch(fetchUserData(json.token)); + localStorage.setItem('reactAppToken', json.token); }); } } +export function checkIfLogged() { + return (dispatch) => { + const token = localStorage.getItem('reactAppToken'); + + if (token !== 'null') { + dispatch(setIsLogged(true)); + dispatch(setToken(token)); + dispatch(fetchUserData(token)) + } else { + dispatch(setIsLogged(false)); + } + } +} + export function fetchUserData(token) { return (dispatch) => { const url = config.url.auth; @@ -86,6 +103,7 @@ export function fetchUserData(token) { fetch(url, fetchData) .then((response) => { if (!response.ok) { + throw Error(response.statusText); } return response; @@ -99,6 +117,7 @@ export function fetchUserData(token) { export function logOut() { return (dispatch) => { + localStorage.removeItem('reactAppToken'); dispatch(setToken('')); dispatch(setIsLogged(false)); dispatch(setUserData({})); diff --git a/src/actions/postPage.js b/src/actions/postPage.js index 81c6699..1dee22b 100644 --- a/src/actions/postPage.js +++ b/src/actions/postPage.js @@ -162,6 +162,7 @@ export function setUsers(users) { } export function fetchUsers() { + console.log('get authors') return (dispatch, getState) => { const url = config.url.users; const token = getState().token; diff --git a/src/components/AuthComponent/AuthComponent.js b/src/components/AuthComponent/AuthComponent.js index 4b72f78..1c67535 100644 --- a/src/components/AuthComponent/AuthComponent.js +++ b/src/components/AuthComponent/AuthComponent.js @@ -2,15 +2,18 @@ import React from 'react'; import { connect } from 'react-redux'; import { browserHistory } from 'react-router'; import PropTypes from 'prop-types'; +import { checkIfLogged } from '../../actions/auth'; export function requireAuthentication(Component) { class AuthComponent extends React.Component { static propTypes = { isLogged: PropTypes.bool.isRequired, + checkIfLogged: PropTypes.func.isRequired } componentWillMount() { + this.props.checkIfLogged(); if (!this.props.isLogged) { browserHistory.push('/login'); } @@ -18,7 +21,7 @@ export function requireAuthentication(Component) { render() { return ( - + this.props.isLogged && ) } } @@ -29,6 +32,11 @@ export function requireAuthentication(Component) { isLogged: state.isLogged }); - return connect(mapStateToProps)(AuthComponent); -} + const mapDispatchToProps = (dispatch) => { + return { + checkIfLogged: () => dispatch(checkIfLogged()) + }; + } + return connect(mapStateToProps, mapDispatchToProps)(AuthComponent); +} diff --git a/src/components/LoginPage/LoginPage.js b/src/components/LoginPage/LoginPage.js index 819fb5c..c49bf50 100644 --- a/src/components/LoginPage/LoginPage.js +++ b/src/components/LoginPage/LoginPage.js @@ -21,12 +21,12 @@ class LoginPage extends React.Component { static propTypes = { isLogged: PropTypes.bool.isRequired, - login: PropTypes.string + login: PropTypes.string, + signIn: PropTypes.func.isRequired } onHandleButton() { - this.props.signIn('luannhayes@qualitern.com', 'lesa'); - // this.props.signIn(this.state.login, this.state.password); + this.props.signIn(this.state.login, this.state.password); browserHistory.push('/'); } From 0d3cbd8fbe81b476aa522b95adeafceb309209cc Mon Sep 17 00:00:00 2001 From: khalska Date: Thu, 22 Jun 2017 09:30:09 +0200 Subject: [PATCH 18/18] Fixes linter errors --- src/actions/actions.js | 3 ++- src/actions/auth.js | 4 ---- src/actions/postPage.js | 6 +++--- src/components/PostPage/PostPage.js | 3 +-- 4 files changed, 6 insertions(+), 10 deletions(-) diff --git a/src/actions/actions.js b/src/actions/actions.js index f7953fe..7ab6eeb 100644 --- a/src/actions/actions.js +++ b/src/actions/actions.js @@ -69,7 +69,8 @@ export function getFilteredPosts() { const title = post.title.toLowerCase(); const body = post.body.toLowerCase(); return (title.indexOf(searchedPhrase) >= 0 || body.indexOf(searchedPhrase) >= 0); - } + } else + return false; }); } diff --git a/src/actions/auth.js b/src/actions/auth.js index 5da6799..27855d4 100644 --- a/src/actions/auth.js +++ b/src/actions/auth.js @@ -1,8 +1,4 @@ import {config} from "../config"; -import { validateLoginForm, - setLoginFormValidation -} from './validation.js'; -import { browserHistory } from 'react-router'; export function setIsLogged(bool) { diff --git a/src/actions/postPage.js b/src/actions/postPage.js index 1dee22b..d11369c 100644 --- a/src/actions/postPage.js +++ b/src/actions/postPage.js @@ -139,13 +139,14 @@ export function updatePost(postId) { .then( (response) => { let posts = getState().posts; - posts = posts.filter( (post) => { - if (post.id == postId) { + posts.filter( (post) => { + if (post.id === postId) { post.title = fetchData.body.title; post.body = fetchData.body.body; post.userId = fetchData.body.userId return true; } + else return false; }); browserHistory.push('/'); //const info = (response.ok) ? 'Changes in post was saved.' : 'Error!' @@ -162,7 +163,6 @@ export function setUsers(users) { } export function fetchUsers() { - console.log('get authors') return (dispatch, getState) => { const url = config.url.users; const token = getState().token; diff --git a/src/components/PostPage/PostPage.js b/src/components/PostPage/PostPage.js index 9379496..d9eeb77 100644 --- a/src/components/PostPage/PostPage.js +++ b/src/components/PostPage/PostPage.js @@ -2,7 +2,6 @@ import React from 'react'; import { Link } from 'react-router' import './PostPage.css'; import PropTypes from 'prop-types'; -import { config } from '../../config.js'; import Comment from '../Comment/Comment'; import User from '../User/User'; import './PostPage.css'; @@ -67,7 +66,7 @@ class PostPage extends React.Component { } handleSubmit() { - const postId = this.props.params.postId; + const postId = Number(this.props.params.postId); postId ? this.props.updatePost(postId) : this.props.addPost(); }