Adam Klein adamkleingit

Timer App

Please create an app for managing timed tasks.

The user can input a text and click Add
A new task is added with the title, and 00:00 time, and a play button.
Clicking Play will play this task: the timer will start running, and the icon will change to a pause icon. Also - any other running task will be paused.
Clicking Pause will pause the task.
The total time is always updated.

	const renderGridRowCell = (colConfig, row, index) => {
	const CustomValue = colConfig.component;
	const value = CustomValue ? <CustomValue data={ row }/> : row[colConfig.field];

	return <td key={ index }>{ value }</td>;
	};

	const useStore = () => {
	const { store } = useContext(ReactReduxContext);

	return store;
	};

	const useSelector = selector => {
	const store = useStore();

	const prevState = selector(store.getState());

	import {createStore} from 'reusable';

	export const useCurrentUser = createStore(() => {
	const [user, setUser] = useState({...});
	...
	return {
	user,
	...
	}
	});

	import {useCurrentUser} from '../stores/currentUser.store';

	const Comp1 = () => {
	const { user } = useCurrentUser();
	...
	}

	const Comp2 = () => {
	const { user } = useCurrentUser(); // Same user
	...

	import {ReusableProvider} from 'reusable';

	export const App = () => (
	<ReusableProvider>
	{ /* App Components */ }
	</ReusableProvider>
	);

	"Redux forces you to write good code" - I've heard that sentence many times.
	In fact - it's quite easy to write bad code with Redux, as I've seen many times.

	In this talk I will show some bad practices and techniques with Redux, and how to avoid them.

	import {createStore} from 'reusable';

	export const useLocale = createStore(() => useState('en'));
	export const useSomething = createStore(() => useReducer(...));

	import {createStore} from 'reusable';

	const useTodos = createStore(() => useState([]));

	const Comp = () => {
	const todosCount = useTodos(
	([todos]) => todos.length
	);
	...
	};