Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Solution #1063

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Conversation

RostyslavSharuiev
Copy link

Copy link

@igorkruz igorkruz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good Job 👍
let's improve your solution

The Clear Completed button should not be visible when there are no completed todos.
image

Comment on lines 12 to 13
const completedTodosCount = todos.filter(todo => todo.completed).length;
const uncompletedTodos = todos.filter(todo => !todo.completed);

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

use useMemo

Comment on lines 41 to 43
onClick={() =>
dispatch({ type: 'setFilter', payload: filterTitle })
}

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

create a handle function for this logic

})}
onDoubleClick={() => setIsEditing(true)}
>
<label className="todo__status-label">

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

label element should be associated with a form control.
To fix this, you should use the htmlFor attribute on the label to associate it with the checkbox input.

Comment on lines 80 to 82
// else {
// document.addEventListener('keyup', handleKeyUp);
// }

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Lets make your code clean, remove committed code.

src/index.tsx Outdated
Comment on lines 4 to 5
// import './styles/todo-list.scss';
// import './styles/filters.scss';

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

remove committed code.

Comment on lines 67 to 74
const handleKeyUp = (event: KeyboardEvent) => {
if (event.key === 'Escape') {
setIsEditing(false);
setTitle(todo.title);
} else if (event.key === 'Enter') {
handleTitleSave();
}
};

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The 'handleKeyUp' function makes the dependencies of useEffect Hook change on every render. Alternatively, wrap the definition of 'handleKeyUp' in its own useCallback() Hook

Copy link

@igorkruz igorkruz left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Well done 🔥

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants