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

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

solution #1735

wants to merge 5 commits into from

Conversation

pasha28091997
Copy link

Copy link

@volodymyr-soltys97 volodymyr-soltys97 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 code
It is bad practice to write all the code in one component, you need to separate the logic into different components. For example Header, Footer, TodoItem, TodoList

Copy link

@etojeDenys etojeDenys left a comment

Choose a reason for hiding this comment

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

we don't need this space here
image

Comment on lines 5 to 6
filter: 'all' | 'active' | 'completed';
handleFilterChenge: (newFilter: 'all' | 'active' | 'completed') => void;

Choose a reason for hiding this comment

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

create some custom type or enum and reuse it everywhere

Copy link

@volodymyr-soltys97 volodymyr-soltys97 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 code

src/App.tsx Outdated
const [title, setTitle] = useState<string>('');
const [loading, setLoading] = useState<boolean>(false);
const [error, setError] = useState<string | null>(null);
const [filter, setFilter] = useState<FilterType>('all');

Choose a reason for hiding this comment

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

Create a enum for 'all', 'active', 'completed' and use it everywhere

onClose,
}) => (
<div
className={`notification is-danger is-light has-text-weight-normal ${isVisible ? '' : 'hidden'}`}

Choose a reason for hiding this comment

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

Use the classnames library for add classes with condition, fix it everywhere

Comment on lines 24 to 46
<a
href="#/"
className={`filter__link ${filter === 'all' ? 'selected' : ''}`}
data-cy="FilterLinkAll"
onClick={() => handleFilterChange('all')}
>
All
</a>

<a
href="#/active"
className={`filter__link ${filter === 'active' ? 'selected' : ''}`}
data-cy="FilterLinkActive"
onClick={() => handleFilterChange('active')}
>
Active
</a>

<a
href="#/completed"
className={`filter__link ${filter === 'completed' ? 'selected' : ''}`}
data-cy="FilterLinkCompleted"
onClick={() => handleFilterChange('completed')}

Choose a reason for hiding this comment

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

Use Object.values(your created enum) and render these options with map() method

только если все задачи выполнены. */}
<button
type="button"
className={`todoapp__toggle-all ${todos.length > 0 && todos.every(todo => todo.completed) ? 'active' : ''}`}

Choose a reason for hiding this comment

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

Move this logic from jsx to the helper variable

/>
</label>
<span data-cy="TodoTitle" className="todo__title">
{todo.title}

Choose a reason for hiding this comment

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

Use destructuring for todo

@@ -0,0 +1,50 @@
/* eslint-disable jsx-a11y/label-has-associated-control */

Choose a reason for hiding this comment

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

Remove file to TodoItem.tsx
image

Copy link

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

4 participants