Skip to content

Commit 047ad6d

Browse files
committed
add all articles
1 parent d9714b9 commit 047ad6d

File tree

6 files changed

+228
-224
lines changed

6 files changed

+228
-224
lines changed

.netlify/state.json

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"siteId": "bb10ded2-a2f7-4a67-87c0-990db4e33e5f"
3+
}

src/templates/GlobalTemplate.js

+4-2
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,10 @@ class GlobalTemplate extends Component {
1717
const { children } = this.props;
1818
return (
1919
<ThemeProvider theme={theme}>
20-
<GlobalStyle />
21-
{children}
20+
<>
21+
<GlobalStyle />
22+
{children}
23+
</>
2224
</ThemeProvider>
2325
);
2426
}

src/views/AdminView.js

+51-42
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react';
1+
import React, { Component } from 'react';
22
import styled from 'styled-components';
33
import MainTemplate from 'templates/MainTemplate';
44
import { Container, Row, Col } from 'reactstrap';
@@ -11,50 +11,59 @@ const StyledContainer = styled(Container)`
1111
min-height: calc(100vh - 58px - 56px - 4em - 5em);
1212
`;
1313

14-
const AdminView = () => {
15-
if (sessionStorage.getItem('logged') != 'true') {
16-
return <Redirect to="/login" />;
14+
class AdminView extends Component {
15+
state = {
16+
userId: '',
17+
};
18+
componentDidMount() {
19+
this.setState({
20+
userId: sessionStorage.getItem('token'),
21+
});
1722
}
18-
return (
19-
<MainTemplate>
20-
<WithoutHeroImg>
21-
<StyledContainer>
22-
<Title className="mb-5">
23-
<>Panel administracyjny</>
24-
</Title>
25-
<Row>
26-
<Col sm="12">
27-
<LinkAdmin link="/new/choose-article">
28-
<>Nowy artykuł</>
29-
</LinkAdmin>
30-
</Col>
31-
<Col sm="12">
32-
<LinkAdmin link="/blog/all-articles/dsfg">
33-
<>Moje artykuły</>
34-
</LinkAdmin>
35-
</Col>
36-
<Col sm="12">
37-
<LinkAdmin link="/blog/all-articles/dsfg">
38-
<>Edytuj artykuł</>
39-
</LinkAdmin>
40-
</Col>
41-
<Col sm="12">
42-
<LinkAdmin link="/blog">
43-
<>Ustawienia konta</>
44-
</LinkAdmin>
45-
</Col>
46-
{sessionStorage.getItem('role') === 'admin' && (
23+
24+
render() {
25+
const { userId } = this.state;
26+
return (
27+
<MainTemplate>
28+
<WithoutHeroImg>
29+
<StyledContainer>
30+
<Title className="mb-5">
31+
<>Panel administracyjny</>
32+
</Title>
33+
<Row>
34+
<Col sm="12">
35+
<LinkAdmin link="/new/choose-article">
36+
<>Nowy artykuł</>
37+
</LinkAdmin>
38+
</Col>
4739
<Col sm="12">
48-
<LinkAdmin link="/settings">
49-
<>Ustawienia strony</>
40+
<LinkAdmin link={`/admin/all-articles/${userId}`}>
41+
<>Moje artykuły</>
5042
</LinkAdmin>
5143
</Col>
52-
)}
53-
</Row>
54-
</StyledContainer>
55-
</WithoutHeroImg>
56-
</MainTemplate>
57-
);
58-
};
44+
<Col sm="12">
45+
<LinkAdmin link={`/admin/all-articles/${userId}`}>
46+
<>Edytuj artykuł</>
47+
</LinkAdmin>
48+
</Col>
49+
<Col sm="12">
50+
<LinkAdmin link="/blog">
51+
<>Ustawienia konta</>
52+
</LinkAdmin>
53+
</Col>
54+
{sessionStorage.getItem('role') === 'admin' && (
55+
<Col sm="12">
56+
<LinkAdmin link="/settings">
57+
<>Ustawienia strony</>
58+
</LinkAdmin>
59+
</Col>
60+
)}
61+
</Row>
62+
</StyledContainer>
63+
</WithoutHeroImg>
64+
</MainTemplate>
65+
);
66+
}
67+
}
5968

6069
export default AdminView;

src/views/AllArticlesView.js

+63-49
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
1-
import React from 'react';
1+
import React, { Component } from 'react';
2+
import PropTypes from 'prop-types';
23
import styled from 'styled-components';
34
import { Link } from 'react-router-dom';
45
import MainTemplate from 'templates/MainTemplate';
56
import { Container, Row, Col, Card, Button, CardTitle, ButtonGroup } from 'reactstrap';
67
import WithoutHeroImg from 'components/Helpers/WithoutHeroImg';
78
import Title from 'components/text/Title/Title';
9+
import axios from 'axios';
810

911
const StyledContainer = styled(Container)`
1012
min-height: calc(100vh - 58px - 56px - 4em - 5em);
@@ -14,54 +16,66 @@ const StyledCard = styled(Card)`
1416
margin-bottom: 1.5em;
1517
`;
1618

17-
const AllArticlesView = () => {
18-
const articles = [
19-
{ title: 'PS5 zabójcza cena!', id: 12, timestamp: '12.05.2020' },
20-
{ title: 'PS5 vs Xbox Serises X', id: 13, timestamp: '15.05.2020' },
21-
{ title: 'T-Mobile Wielkie promocje!', id: 15, timestamp: '12.06.2020' },
22-
{ title: 'Czy potrzebujemy corocznych premier smartfonów?', id: 17, timestamp: '19.05.2020' },
23-
{
24-
title:
25-
'Apple zapłaciło „hakerowi” 75 tys. dolarów. Dzięki temu możecie czuć się bezpieczniej',
26-
id: 21,
27-
timestamp: '12.05.2020',
28-
},
29-
{ title: 'Zoom pada ofiarą własnego sukcesu', id: 32, timestamp: '10.05.2020' },
30-
];
19+
class AllArticlesView extends Component {
20+
state = {
21+
articles: [],
22+
};
3123

32-
return (
33-
<MainTemplate>
34-
<WithoutHeroImg>
35-
<StyledContainer>
36-
<Title className="mb-5">
37-
<>Wszystkie artykuły</>
38-
</Title>
39-
<Row>
40-
<Col sm="6">
41-
{articles.map(article => {
42-
return (
43-
<StyledCard body>
44-
<CardTitle className="font-weight-bold">{article.title}</CardTitle>
45-
<ButtonGroup size="md">
46-
<Button tag={Link} to={`/blog/article/${article.id}`} color="info">
47-
Wyświetl
48-
</Button>
49-
<Button tag={Link} to={`/blog/edit/${article.id}`} color="info">
50-
Edycja
51-
</Button>
52-
<Button tag={Link} to="/blog/article/1" color="info">
53-
Usuń
54-
</Button>
55-
</ButtonGroup>
56-
</StyledCard>
57-
);
58-
})}
59-
</Col>
60-
</Row>
61-
</StyledContainer>
62-
</WithoutHeroImg>
63-
</MainTemplate>
64-
);
65-
};
24+
componentDidMount() {
25+
const { id } = this.props.match.params;
26+
this.getArticles(id);
27+
}
28+
29+
getArticles = id => {
30+
axios
31+
.get(`http://127.0.0.1:5000//all-articles/${id}`)
32+
.then(response => {
33+
console.log(response);
34+
this.setState({
35+
articles: response.data.articles,
36+
});
37+
})
38+
.catch(error => {
39+
console.log(error);
40+
});
41+
};
42+
43+
render() {
44+
const { articles } = this.state;
45+
return (
46+
<MainTemplate>
47+
<WithoutHeroImg>
48+
<StyledContainer>
49+
<Title className="mb-5">
50+
<>Wszystkie artykuły</>
51+
</Title>
52+
<Row>
53+
<Col sm="6">
54+
{articles.map(article => {
55+
return (
56+
<StyledCard body>
57+
<CardTitle className="font-weight-bold">{article.title}</CardTitle>
58+
<ButtonGroup size="md">
59+
<Button tag={Link} to={`/blog/article/${article.id}`} color="info">
60+
Wyświetl
61+
</Button>
62+
<Button tag={Link} to={`/blog/edit/${article.id}`} color="info">
63+
Edycja
64+
</Button>
65+
<Button tag={Link} to={`/blog/article/${article.id}`} color="info">
66+
Usuń
67+
</Button>
68+
</ButtonGroup>
69+
</StyledCard>
70+
);
71+
})}
72+
</Col>
73+
</Row>
74+
</StyledContainer>
75+
</WithoutHeroImg>
76+
</MainTemplate>
77+
);
78+
}
79+
}
6680

6781
export default AllArticlesView;

src/views/App.js

+27-25
Original file line numberDiff line numberDiff line change
@@ -25,31 +25,33 @@ import Preloader from '../components/Preloader/Preloader';
2525
const App = () => (
2626
<BrowserRouter>
2727
<GlobalTemplate>
28-
<Preloader />
29-
<Switch>
30-
<Route exact path="/" render={() => <Redirect to="/blog" />} />
31-
<Route exact path="/login" component={LoginView} />
32-
<Route exact path="/admin" component={AdminView} />
33-
<Route exact path="/blog" component={BlogView} />
34-
<Route exact path="/about" component={AboutUsView} />
35-
<Route exact path="/contact" component={ContactView} />
36-
<Route exact path="/blog/gallery/:id" component={GalleryTemplate} />
37-
<Route exact path="/blog/simple-text/:id" component={SimpleTextTemplate} />
38-
<Route exact path="/blog/article/:id" component={ArticleTemplate} />
39-
<Route exact path="/blog/article-tiles/:id" component={ArticleTilesTemplate} />
40-
<Route exact path="/blog/article-bottom-tile/:id" component={ArticleBottomTileTemplate} />
41-
<Route exact path="/blog/hero/:id" component={HeroTemplate} />
42-
<Route exact path="/blog/slider/:id" component={SliderTemplate} />
43-
<Route
44-
exact
45-
path="/blog/ilustrated-article-bottom-tile/:id"
46-
component={IlustratedArticleTemplate}
47-
/>
48-
<ProtectedRoute exact path="/new/choose-article" component={ChooseArticleView} />
49-
<ProtectedRoute exact path="/blog/all-articles/:id" component={AllArticlesView} />
50-
<ProtectedRoute exact path="/new/:id" component={NewArticleView} />
51-
<ProtectedAdminRoute exact path="/settings" component={SiteSettings} />
52-
</Switch>
28+
<>
29+
<Preloader />
30+
<Switch>
31+
<Route exact path="/" render={() => <Redirect to="/blog" />} />
32+
<Route exact path="/login" component={LoginView} />
33+
<ProtectedRoute exact path="/admin" component={AdminView} />
34+
<Route exact path="/blog" component={BlogView} />
35+
<Route exact path="/about" component={AboutUsView} />
36+
<Route exact path="/contact" component={ContactView} />
37+
<Route exact path="/blog/gallery/:id" component={GalleryTemplate} />
38+
<Route exact path="/blog/simple-text/:id" component={SimpleTextTemplate} />
39+
<Route exact path="/blog/article/:id" component={ArticleTemplate} />
40+
<Route exact path="/blog/article-tiles/:id" component={ArticleTilesTemplate} />
41+
<Route exact path="/blog/article-bottom-tile/:id" component={ArticleBottomTileTemplate} />
42+
<Route exact path="/blog/hero/:id" component={HeroTemplate} />
43+
<Route exact path="/blog/slider/:id" component={SliderTemplate} />
44+
<Route
45+
exact
46+
path="/blog/ilustrated-article-bottom-tile/:id"
47+
component={IlustratedArticleTemplate}
48+
/>
49+
<ProtectedRoute exact path="/new/choose-article" component={ChooseArticleView} />
50+
<ProtectedRoute exact path="/admin/all-articles/:id" component={AllArticlesView} />
51+
<ProtectedRoute exact path="/new/:id" component={NewArticleView} />
52+
<ProtectedAdminRoute exact path="/settings" component={SiteSettings} />
53+
</Switch>
54+
</>
5355
</GlobalTemplate>
5456
</BrowserRouter>
5557
);

0 commit comments

Comments
 (0)