Skip to content
Snippets Groups Projects
Commit 9e83d309 authored by Chif Gergő's avatar Chif Gergő
Browse files

Create Page componenet whicjh holds the main layout

parent 3907249d
Branches
Tags
2 merge requests!19fix type imports,!8Refactor structure
import React, { useEffect } from 'react';
import React from 'react';
import { BrowserRouter as Router } from 'react-router-dom';
import styled from 'styled-components';
import Footer from './components/Footer';
import Header from './components/Header';
import { UserStateProvider } from './context/UserContext';
import useAddNews from './hooks/useAddNews';
import Routes from './Routes';
const Container = styled.div`
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
`;
const MainContent = styled.div`
height: 100%;
`;
function App(): React.ReactElement {
const [response, addNews] = useAddNews();
useEffect(() => {
addNews({ body: { title: 'Testing', text: 'Test Test TEST' } });
}, [addNews]);
useEffect(() => {
if (response.data) {
console.log(response.data.text);
}
}, [response.data]);
return (
<UserStateProvider>
<Router>
<Container>
<Header />
<MainContent>
<Routes />
</MainContent>
<Footer />
</Container>
</Router>
</UserStateProvider>
);
......
import { Container } from '@material-ui/core';
import React from 'react';
import NewsContainer from '../components/NewsContainer';
import Page from './Page';
const NewsPage: React.FC = () => (
<Page>
<Container>
<NewsContainer />
</Container>
</Page>
);
export default NewsPage;
import React from 'react';
import styled from 'styled-components';
import Footer from '../components/Footer';
import Header from '../components/Header';
const Container = styled.div`
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
`;
const MainContent = styled.div`
height: 100%;
`;
const Page: React.FC = ({ children }) => {
return (
<Container>
<Header />
<MainContent>{children}</MainContent>
<Footer />
</Container>
);
};
export default Page;
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment