ToDoList | List Website built with HTML , CSS , Vanilla JavaScript | Web Site library

Your spec says:

You could just change the class of your list (the

not the
• ) and let CSS casscading take care of the rest. .forEach() is definitely not needed nor any array or NodeList for that matter. Also, you should always have a default in a switch() -- in this example default removes both classes from
  (it doesn't matter if class is actually there or not so covering both is 100% no calculations involved). BTW, "click" is ok in this situation, but you should use "change" event since it's designed for form controls like . const form = document.forms[0]; const select = form.elements.filter; select.addEventListener('change', filterList); function filterList(e) { const select = e.target; const list = document.querySelector('.list'); if (select.matches('#filter')) { switch (select.value) { case 'done': list.classList.remove('open'); list.classList.add('done'); break; case 'open': list.classList.remove('done'); list.classList.add('open'); break; default: list.classList.remove('done'); list.classList.remove('open'); break; } } }; li.open::before { content: '⬛' } li.done::before { content: '☑️' } .list.open li.done { display: none } .list.done li.open { display: none } All Completed Uncompleted
  • Task
  • Task
  • Task
  • Task
  • Task
  • Task
  • Task
  • Task
  • Task

It seems like .env file is not contained in your image.

Try to execute source .env after copying .env file into the image.

Your classes TodoItem and TodoList are fairly simple and have one responsibility (Single responsibility Principle). And these classes do not have any code that can pollute their single responsibility. I mean there is no logic for logging or other responsibilities in these classes. So it is okay. Read another great post about Single Responsibility Principle.

But it looks like your code in solution 1 will not save any items as your item will be added to IReadOnlyList Items.

I like that repository has great separation of concerns. I mean that repository is here like simple collection of items. We can make analogy with List, that List does not have Save() method. Responsibility of saving item is delegated to _unitOfWork. And this is also great separation of concerns.

It is the expected behaviour. You are constructing two separate app bars for both the screens so they are bound to flash. This is not the correct way. The correct way would be to actually put the scaffold in your main activity and place the NavHost as it's content. If you wish to modify the app bar, create variables to hold state. Then modify them from the Composables. Ideally, store then in a viewmodel. That is how it is done in compose. Through variables.

Thanks

You can use uuid library

The initial state in TodoList seems to be having list:[{title: "", id: ""}], which contains empty title and id. Since it's mapped to create Todo, I think it starts with an empty Todo.

While h is the heuristic, a plausible guess of the possible cost it will be needed to reach the end node, g is the actual cost spent to reach the current node. In your case it could be even the same euclidian distance you use for h.

In a real case scenario, using euclidian distance, a graph connecting different cities, h is the air-distance of two cities while g is their road-distance.

Furthermore, if you are using a monotonic heuristic (or an underestimating heuristic, such as the euclidian distance) you will not need the close list, since it is provent that the first found path will also be the shortest: longer or already visited paths will be dropped before being explored.

Probably what is confusing is the fact that you need to keep track of g during the exploration of the graph, while h just measure a straight line between current and end nodes, g measure all the lines between the nodes you explored to reach the current.

Your TodoReducer should return TodoState types at all times.

Currently, you are only logging state and action inside your reducer. Fill it up and it should work fine.