set store layout

This commit is contained in:
Ruidy 2020-10-23 08:53:11 +02:00
parent 55698db937
commit 33cb46b4ff
8 changed files with 30 additions and 18 deletions

View file

@ -1,13 +1,12 @@
import React, { FC } from 'react';
import Router from './Router';
import { Header } from './components/Header';
import { Layout } from './components/layout';
const App: FC = () => (
<>
<Header />
<Layout>
<Router />
</>
</Layout>
);
export default App;

11
src/components/layout.tsx Normal file
View file

@ -0,0 +1,11 @@
import React from 'react';
import { FC } from 'react';
import { Header } from './Header';
export const Layout: FC = ({ children }) => (
<div>
<Header />
{children}
</div>
);

View file

@ -1,11 +1,12 @@
import React, { FC } from 'react';
import React, { FC, memo } from 'react';
import Todo from '../../core/models/todo';
interface Props {
todos: Todo[];
}
export const TodoList: FC<Props> = ({ todos }) => (
const TodoList: FC<Props> = ({ todos }) => (
<div>
<ul>
{todos.map((todo) => (
@ -16,3 +17,5 @@ export const TodoList: FC<Props> = ({ todos }) => (
</ul>
</div>
);
export default memo(TodoList);

View file

@ -1,28 +1,26 @@
import React, { FC } from 'react';
import { TodoList } from './TodoList';
import TodoList from './TodoList';
import { Button } from '../../components/button';
import { Container } from '../../components/container';
import Todo from '../../core/models/todo';
import { listTodos } from '../../core/services/todo';
import { Container } from '../../components/container';
export const Home: FC = () => {
const todos: Todo[] = listTodos();
return (
<div>
<Container>
<h1>Your tasks</h1>
<p>Hi there!</p>
<TodoList todos={todos} />
<Container>
<Button primary onClick={() => console.log('Clicked Normal Button')}>
Normal Button
</Button>
<Button primary onClick={() => console.log('Clicked Primary Button')}>
Primary Button
</Button>
</Container>
</div>
<Button primary onClick={() => console.log('Clicked Normal Button')}>
Normal Button
</Button>
<Button primary onClick={() => console.log('Clicked Primary Button')}>
Primary Button
</Button>
</Container>
);
};

1
src/core/store/index.ts Normal file
View file

@ -0,0 +1 @@
// init redux here

View file

View file

View file