Skip to content

to-do Giorgio#449

Open
GiorgioCugusi wants to merge 4 commits intoTechnigo:masterfrom
GiorgioCugusi:master
Open

to-do Giorgio#449
GiorgioCugusi wants to merge 4 commits intoTechnigo:masterfrom
GiorgioCugusi:master

Conversation

@GiorgioCugusi
Copy link
Copy Markdown

No description provided.

Copy link
Copy Markdown

@AnnikaSonnek AnnikaSonnek left a comment

Choose a reason for hiding this comment

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

This project was easy to follow, there were some places where it would have been nice with some comments. Cool that you've used Tailwind, you have to tell be what you thought of it!

Well done!!

import 'bootstrap-icons/font/bootstrap-icons.css';
import Header from 'components/Header';

export const App = () => {
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

I see that all of your components are jsx-files. How come? I've never seen it before!

dispatch(Tasks.actions.deleteAllTasks());
}
return (
<section className="w-full mb-10">
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

I see that you've used Tailwind, what did you think about it? The classnames looks craaaaazy hahah!

},
{
id: 3,
text: 'Never come back',
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Hahhahah! I like this one!

const id = action.payload;
// splice to remove a single element if I know the index
const copyOfTaskArrayFromStore = store.items;
const condition = (element) => element.id === id;
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

That's a nice way of keeping the code clean! To actually define the condition separately and then use it in the findIndex-method below! Even though it might be longer, it's easier to follow! Cool!

const copyOfTaskArrayFromStore = store.items;
const condition = (element) => element.id === id;
const foundIndex = copyOfTaskArrayFromStore.findIndex(condition);
copyOfTaskArrayFromStore[foundIndex].isComplete = !copyOfTaskArrayFromStore[foundIndex].isComplete;
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

That's cool! So you've added the foundIndex-function inside the toggle. I've seen people do this but never fully understood it. So the [foundIndex] in copyOfTaskArrayFromStore[foundIndex].isComplete references the variable above, and is used as the index since it's between square brackets right? I did it like this:

toggleTask: (store, action) => { store.items.forEach((item) => { if (item.id === action.payload.taskId) { item.isDone = !item.isDone } }) }

const day = date.getDate();
const month = date.getMonth() + 1;
const year = date.getFullYear();
const currentDate = `${day}/${month}/${year}`;
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

It's a little long code snippet that could probably be made shorter, but honestly I understand everything of what is happening here so I like it!

type="text"
name="todo"
className="block w-full border-0 p-0 text-gray-900 placeholder:text-gray-400 focus:ring-0 sm:text-sm sm:leading-6 bg-transparent"
placeholder="Get some sun" />
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

I like this placeholder!

@@ -0,0 +1,28 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Hahah I have NO idea of what is happening here! Is tailwind the reason why you changed the files to jsx-files?

event.preventDefault();
const newTask = {
id: Date.now().toString(),
text: capitalize(inputValue),
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Is this a reference to some css-style? It looks so short but still does the work of making the first letter in the added task be big. My code looks like this:

text: inputValue.charAt(0).toUpperCase() + inputValue.slice(1)

So much longer...

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