microsoft/frontend-bootcamp
1
0
Fork 0
mirror of https://github.com/microsoft/frontend-bootcamp.git synced 2026-01-26 14:56:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

combine containers

Browse Source
This commit is contained in:
Ken
2019-02-13 13:24:57 -08:00
parent 392ebe4a5c
commit 09848e5fe6
12 changed files with 131 additions and 119 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
playground/src/components/TodoApp.tsx
View File

@@ -3,31 +3,13 @@ import { Stack } from '@uifabric/experiments';
import { TodoFooter } from './TodoFooter';
import { TodoHeader } from './TodoHeader';
import { TodoList } from './TodoList';
import { TodoItem, FilterTypes } from '../store';
export interface TodoAppProps {
todos: { [id: string]: TodoItem };
filter: FilterTypes;
add: (label: string) => void;
remove: (id: string) => void;
edit: (id: string, label: string) => void;
complete: (id: string) => void;
clear: () => void;
setFilter: (filter: FilterTypes) => void;
}
export class TodoApp extends React.Component<TodoAppProps> {
render() {
const { todos, filter, add, remove, setFilter, complete, clear, edit } = this.props;
return (
<Stack horizontalAlign="center">
<Stack style={{ width: 400 }} verticalGap={25}>
<TodoHeader {...{ add, remove, filter: setFilter }} />
<TodoList {...{ todos, filter, complete, remove, edit }} />
<TodoFooter {...{ todos, setFilter, clear }} />
</Stack>
</Stack>
);
}
}
export const TodoApp = (props: {}) => (
<Stack horizontalAlign="center">
<Stack style={{ width: 400 }} verticalGap={25}>
<TodoHeader />
<TodoList />
<TodoFooter />
</Stack>
</Stack>
);