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 #1044

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

Conversation

vadimurbanovich
Copy link

Copy link

@BudnikOleksii BudnikOleksii left a comment

Choose a reason for hiding this comment

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

Good work 👍
Left a few suggestions, check them

src/App.tsx Outdated
Comment on lines 16 to 17
const todos = useAppSelector(state => state.todos);
const currentTodo = useAppSelector(state => state.currentTodo);

Choose a reason for hiding this comment

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

It's better to create selectors so you can reuse them
https://redux.js.org/usage/deriving-data-selectors

src/App.tsx Outdated
const dispatch = useDispatch();
const todos = useAppSelector(state => state.todos);
const currentTodo = useAppSelector(state => state.currentTodo);
const [loader, setLoader] = useState(false);

Choose a reason for hiding this comment

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

Boolean variables should start from is or has

Comment on lines 19 to 21
const filteredTodos = todos
.filter(todo => {
if (status === Status.Active) {

Choose a reason for hiding this comment

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

  • Create a separate function and move it to utils/helpers folder
  • if there are no query and status is all you don't need to filter at all
  • also, you can try to do it in one filter


<tbody>
{filteredTodos.map(({ id, completed, title, userId }) => (
<tr key={id} data-cy="todo">

Choose a reason for hiding this comment

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

Create a todo component

const dispatch = useDispatch();
const currentTodo = useAppSelector(state => state.currentTodo);
const [user, setUser] = useState<User>();
const [loading, setLoading] = useState<boolean>(true);

Choose a reason for hiding this comment

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

The same about naming

Comment on lines 20 to 21
setLoading(true);
if (currentTodo) {

Choose a reason for hiding this comment

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

If there is no currentTodo user will see infinite loader

Copy link

@ArturErmolenko ArturErmolenko 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.

3 participants