diff --git a/package.json b/package.json
index 5d4da3637a8a8ab81752cd793f77542ec1f82262..b058ad52d0439fac1ea5b67a30e3f1c0cdb43bd2 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
{
"name": "kszkepzes-frontend",
"version": "0.1.0",
- "proxy": "http://127.0.0.1:8000",
+ "proxy": "http://127.0.0.1:8000/",
"private": true,
"dependencies": {
"axios": "^0.17.1",
diff --git a/src/actions/auth.js b/src/actions/auth.js
index ba8f7d9db5bafbf3509856bb16d95aa31eee127d..30b176a967fa847546eed68669c80cb0ef88ce2b 100644
--- a/src/actions/auth.js
+++ b/src/actions/auth.js
@@ -1,5 +1,7 @@
+// TODO: Separate actions
+
import ax from 'axios';
-import { GET_USERDATA, PROFILE_CHANGE, GROUP_CHANGE, LOGOUT } from './types';
+import { GET_USERDATA, PROFILE_CHANGE, GROUP_CHANGE, LOGOUT, GET_NEWS } from './types';
const axios = ax.create({
xsrfCookieName: 'csrftoken',
@@ -21,6 +23,16 @@ export const getUserData = () => (
}
);
+export const getNews = () => (
+ async (dispatch) => {
+ const news = await axios.get('/api/v1/news');
+ dispatch({
+ type: GET_NEWS,
+ payload: news,
+ });
+ }
+);
+
export const textChange = ({ target: { name, value } }) => (
(dispatch) => {
dispatch({ type: PROFILE_CHANGE, payload: value, target: name });
diff --git a/src/actions/types.js b/src/actions/types.js
index af56763f7a340fd50dc8bed5a6c5e5e31c2fdb86..f6891993f91473e63639fbcf6456ea863cdec3be 100644
--- a/src/actions/types.js
+++ b/src/actions/types.js
@@ -1,4 +1,7 @@
export const GET_USERDATA = 'get_userdata';
+export const GET_NEWS = 'get_news';
+
export const PROFILE_CHANGE = 'profile_change';
export const GROUP_CHANGE = 'group_change';
+
export const LOGOUT = 'logout';
diff --git a/src/components/Header.js b/src/components/Header.js
index d8abfc4f0303acae7d30f1e700e05a4f29b5f74f..ebdd23e9d6c281f611a13ee8ad48b6326e7a570f 100644
--- a/src/components/Header.js
+++ b/src/components/Header.js
@@ -15,18 +15,12 @@ import KSZKlogo from './images/kszk_logo.svg';
const FixedMenu = ({ user }) => (
<Menu fixed='top' size='large' pointing>
<Container>
- <Menu.Item as={NavLink} to='/home'>
- FĹoldal
- </Menu.Item>
- <Menu.Item as={NavLink} to='/circles'>
- KĂśreink
- </Menu.Item>
- <Menu.Item as={NavLink} to='/trainers'>
- KĂŠpzĹk
- </Menu.Item>
- <Menu.Item as={NavLink} to='/schedule'>
- Ătemterv
- </Menu.Item>
+ <Menu.Item as={NavLink} to='/home'>FĹoldal</Menu.Item>
+ <Menu.Item as={NavLink} to='/news'>HĂrek</Menu.Item>
+ <Menu.Item as={NavLink} to='/circles'>KĂśreink</Menu.Item>
+ <Menu.Item as={NavLink} to='/trainers'>KĂŠpzĹk</Menu.Item>
+ <Menu.Item as={NavLink} to='/schedule'>Ătemterv</Menu.Item>
+
<Menu.Menu position='right'>
<Menu.Item className='item'>
{
@@ -85,15 +79,11 @@ class Header extends Component {
/>
FĹoldal
</Menu.Item>
- <Menu.Item as={NavLink} to='/circles'>
- KĂśreink
- </Menu.Item>
- <Menu.Item as={NavLink} to='/trainers'>
- KĂŠpzĹk
- </Menu.Item>
- <Menu.Item as={NavLink} to='/schedule'>
- Ătemterv
- </Menu.Item>
+ <Menu.Item as={NavLink} to='/news'>HĂrek</Menu.Item>
+ <Menu.Item as={NavLink} to='/circles'>KĂśreink</Menu.Item>
+ <Menu.Item as={NavLink} to='/trainers'>KĂŠpzĹk</Menu.Item>
+ <Menu.Item as={NavLink} to='/schedule'>Ătemterv</Menu.Item>
+
<Menu.Item position='right'>
{
this.props.user.id ?
@@ -102,9 +92,7 @@ class Header extends Component {
<Button onClick={() => this.props.logout()} icon='sign out' />
</Button.Group>
:
- <Button as='a' href='/api/v1/login/authsch/' inverted>
- BejelentkezĂŠs
- </Button>
+ <Button as='a' href='/api/v1/login/authsch/' inverted>BejelentkezĂŠs</Button>
}
</Menu.Item>
</Menu>
diff --git a/src/components/Main.js b/src/components/Main.js
index dfc391debf8dde4eaf090c7708f0656275ebc57e..cd91904eb824332ee0e9305c8f581540b1c9241a 100644
--- a/src/components/Main.js
+++ b/src/components/Main.js
@@ -1,5 +1,6 @@
import React from 'react';
import { Switch, Route, Redirect, withRouter } from 'react-router-dom';
+
import Home from './pages/Home';
import Trainers from './pages/Trainers';
import Schedule from './pages/Schedule';
@@ -7,11 +8,13 @@ import NotFound from './pages/NotFound';
import Profile from './pages/Profile';
import Statistics from './pages/Statistics';
import Circles from './pages/Circles';
+import News from './pages/News';
const Main = () => (
<Switch>
<Redirect exact from='/' to='/home' />
<Route exact path='/home' component={Home} />
+ <Route path='/news' component={News} />
<Route path='/trainers' component={Trainers} />
<Route path='/schedule' component={Schedule} />
<Route path='/profile' component={withRouter(Profile)} />
diff --git a/src/components/pages/News.js b/src/components/pages/News.js
new file mode 100644
index 0000000000000000000000000000000000000000..98ec6369dab3b8bc9d335b10a2fdcc60e82a08ae
--- /dev/null
+++ b/src/components/pages/News.js
@@ -0,0 +1,59 @@
+import React, { Component } from 'react';
+import { Container, Header, Segment, Divider } from 'semantic-ui-react';
+import { connect } from 'react-redux';
+
+import { getNews } from '../../actions';
+
+class News extends Component {
+
+ componentWillMount() {
+ this.props.getNews();
+ }
+
+ render_news() {
+ const news = this.props.news;
+ console.log(news);
+
+ return news.map( (item, index) => (
+ <div key={index}>
+ { index > 0 ? <Divider /> : ''}
+ <Header as='h3' style={{ fontSize: '2em' }}>{item.title}</Header>
+ <p style={{ fontSize: '1.33em' }}>{item.text}</p>
+ </div>
+ ));
+
+ }
+
+ render() {
+ return (
+ <div>
+ <Segment inverted textAlign='center' vertical>
+ <Container>
+ <Header
+ as='h1'
+ content='HĂrek'
+ inverted
+ style={{
+ fontSize: '3em',
+ fontWeight: 'normal',
+ marginBottom: 0,
+ marginTop: '0.5em',
+ }}
+ />
+ </Container>
+ </Segment>
+
+ <Segment style={{ padding: '8em 0em' }} vertical>
+ <Container text>
+ {this.render_news()}
+ </Container>
+ </Segment>
+ </div>
+ );
+ }
+}
+
+
+const mapStateToProps = ({ news }) => ({ news });
+
+export default connect(mapStateToProps, { getNews })(News);
diff --git a/src/components/pages/Profile.js b/src/components/pages/Profile.js
index 8f0f725663be54ce24a7cefd6ff99e3778b20016..17a77df316b2935c071e53b1b9177d97441a986e 100644
--- a/src/components/pages/Profile.js
+++ b/src/components/pages/Profile.js
@@ -1,5 +1,5 @@
import React, { Component } from 'react';
-import { Container, Segment, Form, Dropdown, Divider, Card, Header } from 'semantic-ui-react';
+import { Container, Segment, Form, Dropdown, Divider, Header } from 'semantic-ui-react';
import { connect } from 'react-redux';
import { textChange, submitRegistration, groupChange } from '../../actions';
diff --git a/src/reducers/NewsReducer.js b/src/reducers/NewsReducer.js
new file mode 100644
index 0000000000000000000000000000000000000000..a1f1497ded94643758880ed039b202ea417d0d64
--- /dev/null
+++ b/src/reducers/NewsReducer.js
@@ -0,0 +1,12 @@
+import { GET_NEWS } from '../actions/types';
+
+const INITIAL_STATE = [];
+
+export default (state = INITIAL_STATE, action) => {
+ switch (action.type) {
+ case GET_NEWS:
+ return [ ...state, ...action.payload.data ];
+ default:
+ return state;
+ }
+};
diff --git a/src/reducers/index.js b/src/reducers/index.js
index 4efaaedff82e2b3d46a25e5b9bea99a57e6faf02..8fa74b2a23a02498d8b8bc2761cb63e34c4d9e8c 100644
--- a/src/reducers/index.js
+++ b/src/reducers/index.js
@@ -1,8 +1,10 @@
import { combineReducers } from 'redux';
import UserReducer from './UserReducer';
+import NewsReducer from './NewsReducer';
const rootReducer = combineReducers({
user: UserReducer,
+ news: NewsReducer,
});
export default rootReducer;