Skip to content
Snippets Groups Projects
Commit 6a02a3fc authored by thibault.capt's avatar thibault.capt
Browse files

(feat): add store

parent bc0920bb
No related branches found
No related tags found
No related merge requests found
......@@ -22,3 +22,4 @@
| 18.02.2025 | Modal pour ajouter une voiture | - | - | Angular garage -> Je me rends compte que c'est trop gros pour un "petit projet". Je recommence pour une TODO list |
| 19.02.2025 | Essayer de finir le front de la TODO's list | - | - | - |
| 20.02.2025 | Finir de back + lier front et back | - | - | - |
| 22.02.2025 | Utiliser un store pour les données front | - | - | loading infini => voir pourquoi |
......@@ -31,13 +31,19 @@ public class TodoController {
}
@DeleteMapping("/{id}")
public ResponseEntity<Void> delete(@PathVariable Long id) {
public ResponseEntity<Long> delete(@PathVariable Long id) {
if (!todoRepository.existsById(id)){
return ResponseEntity.notFound().build();
}
todoRepository.deleteById(id);
return ResponseEntity.noContent().build();
return ResponseEntity.ok(id);
}
@PatchMapping("/{id}")
public ResponseEntity<Todo> toggleCompleted(@PathVariable Long id) {
if (!todoRepository.existsById(id)){
return ResponseEntity.notFound().build();
}
Todo todo = todoRepository.findById(id).orElseThrow();
todo.setCompleted(!todo.isCompleted());
Todo updated = todoRepository.save(todo);
......
......@@ -3,9 +3,7 @@
"version": 1,
"cli": {
"packageManager": "pnpm",
"schematicCollections": [
"angular-eslint"
],
"schematicCollections": ["angular-eslint"],
"analytics": false
},
"newProjectRoot": "projects",
......
......@@ -6,14 +6,19 @@
<!-- Liste des tâches -->
<div class="flex-grow flex items-center justify-center py-5">
<ul class="list text-gray-600 text-lg">
@for (todo of todos(); track todo.id) {
<app-todo-list-item [todo]="todo" (toggleCompleted)="toggleCompleted($event)" (remove)="remove($event)" />
}
</ul>
@if (store.isLoading()) {
<span class="loading loading-spinner loading-xl"></span>
} @else {
<ul class="list text-gray-600 text-lg">
@let todos = store.todos();
@for (todo of todos; track todo.id) {
<app-todo-list-item [todo]="todo" (toggleCompleted)="toggleCompleted($event)" (remove)="remove($event)" />
}
</ul>
@if (!todos()?.length) {
<p class="text-gray-600 text-lg">Ajoute ta première tâche 👆</p>
@if (!todos?.length) {
<p class="text-gray-600 text-lg">Ajoute ta première tâche 👆</p>
}
}
</div>
</div>
......
import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
import { TodoService } from '@core/ports/todo.service';
import { toSignal } from '@angular/core/rxjs-interop';
import { BehaviorSubject, switchMap, tap } from 'rxjs';
import { FormsModule } from '@angular/forms';
import { Todo } from '@core/models/todo';
import { AddTodoFormComponent } from '@features/todo-list/components/add-todo-form.component';
......@@ -16,30 +13,18 @@ import { TodoStore } from '@core/todo.store';
providers: [TodoStore],
})
export default class TodoListComponent {
// TODO: Implement the logic with TodoStore
private reload$$ = new BehaviorSubject<void>(void 0);
private readonly todoService = inject(TodoService);
todos = toSignal(this.reload$$.pipe(switchMap(() => this.todoService.getAll())));
protected readonly store = inject(TodoStore);
addTodo(todoName: string) {
if (!todoName) return;
this.todoService
.add(todoName)
.pipe(tap(() => this.reload$$.next()))
.subscribe();
this.store.add(todoName);
}
toggleCompleted(todo: Todo) {
this.todoService
.toggleCompleted(todo.id)
.pipe(tap(() => this.reload$$.next()))
.subscribe();
this.store.toggleCompleted(todo.id);
}
remove(todo: Todo) {
this.todoService
.remove(todo.id)
.pipe(tap(() => this.reload$$.next()))
.subscribe();
this.store.remove(todo.id);
}
}
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment