x64bits / todo-app Goto Github PK

File with unused lines of code, it seems to me that the file in general is not used in the entire project, do you plan to use it later?

src/utilities/fetc-call.js

Why does the width property have such a specific size?

File: https://github.com/x64Bits/todo-app/blob/main/src/components/Task/themes.js#L9

There are two png files in this folder that I don't know if they are in use?

public/*

These styles should be moved to a constant to avoid contaminating the code and making it hard to read.

File: https://github.com/x64Bits/todo-app/blob/main/src/components/Todo/index.jsx#L66

Unused function and props

File: src/components/Task/index.jsx

To further promote readability and indicate your intent I suggest that when the condition is not complicated and does not require a lower value of the condition to use:

Block condition

if(condition) {
     fetchData()
}

Instead of:

Short-circuit condition
condition && fetchData()

File: https://github.com/x64Bits/todo-app/blob/main/src/components/Todo/index.jsx#L57

Two nomenclatures are being used when naming project assets.

Folder with these files

This recommendation can be applied for each file considered an asset in the project, it can be inside src/assets or public as css files, plain javascript, images, videos, etc...

Bad: Github_Logo.png
Bad: signInLogo.svg

Recomendation: github-logo.png
Recomendation: sign-in-logo.svg

In order not to have so many secondary effects in a single component, it is possible to move the first useEffect to the one that already depends on the client, to make the set you can verify if the token is not already full and remember if that verification is done add the token to the array of deps

File: https://github.com/x64Bits/todo-app/blob/main/src/screens/tasks/index.jsx#L52

Are you using this file somewhere in the project?

src/logo.svg

• Avoid comments of code on production.
• Use keyframes function of styled components instead of keyframes css inside a component style.

File: src/components/Task/styles.js

It is possible to pass the styles that this component will use with Transient props format which will help these values not reach the real DOM, check with the browser inspector that these prop values can be seen even though the element does not support them, when using Transient props are removed by the compiler if the DOM element does not support it.

Avoid overriding the theme prop because it is used when global props of the theme defined in the are needed.

File: src/components/Task/index.jsx

To prevent the date calculation from being done with each change in the DOM of this component, it is possible to nest the function in a useCallBack so that it only changes when the date value changes.

File: src/components/Task/index.js

preventDefault has to come before any code because it might not prevent in time.

File: https://github.com/x64Bits/todo-app/blob/main/src/screens/tasks/index.jsx#L92

Unused imports and declarations.

src/index.js