fix api

javascript/11_API/05_todo_app_crud/script.js

@@ -13,17 +13,11 @@ const loading = document.querySelector('#loading');
 const counter = document.querySelector('#counter');
 
 
-// ===== VARIABILE DI STATO =====
-// Tiene traccia dell'ID utente attualmente caricato
-// Viene usata per sapere a quale utente associare i nuovi TODO
-// DA COMPLETARE: Carica questa variabile dal localStorage (se presente)
-let currentUserId = null;
-
 
 /**
  * FUNZIONE: Crea la card HTML per tutti i TODO passati come parametro
  */
-function creaCardTodos(todoList) {
+function creaCardsTodos(todoList) {
     allTodos = todoList.map((todo) => `
       <div class="todo-item ${todo.completato ? 'completed' : ''}">
             <div class="todo-checkbox">
@@ -67,8 +61,18 @@ function handleError(message) {
  * 2. addTodo()           - POST /todos             (CREATE)
  * 3. toggleTodo()        - PUT /todos/{id}         (UPDATE)
  * 4. deleteTodo()        - DELETE /todos/{id}      (DELETE)
+ * 
+ * BONUS (OPZIONALE): Persistenza con localStorage
+ * Se hai completato tutte le funzioni, puoi aggiungere la persistenza dell'utente:
+ * - Quando carichi i TODO, salva l'ID utente nel localStorage
+ * - Al caricamento della pagina, recupera l'ID dal localStorage
+ * - Pre-compila l'input e carica automaticamente i TODO se presente
  */
 
+// ===== VARIABILE DI STATO =====
+let currentUserId = null; // Variabile globale per tenere traccia dell'ID utente corrente
+
+
 /**
  * FUNZIONE 1️⃣: Carica TODO (GET)
  * 
@@ -82,7 +86,7 @@ function handleError(message) {
  *  7. Converti la risposta in JSON
  *  8. Chiama displayTodos() per visualizzare
  *  9. Nascondi lo spinner e mostra addTodoSection
- * 10. Salva l'ID utente in currentUserId (e localStorage)
+ * 10. Salva l'ID utente in currentUserId
  */
 async function fetchTodosUtente() {
     // TODO Rimuovi questa riga e completa la funzione
@@ -94,7 +98,8 @@ async function fetchTodosUtente() {
  * FUNZIONE 2️⃣: Aggiungi TODO (POST)
  * 
  * Passi:
- * 1. Verifica che un utente sia stato caricato (currentUserId)
+ * 1. Verifica che un utente sia stato caricato (currentUserId !== null)
+ *    Altrimenti, mostra errore "Carica prima un utente!" e return
  * 2. Leggi il testo dal campo di input del nuovo TODO
  * 3. Valida con trim che non sia vuoto
  * 4. Mostra lo spinner di caricamento
@@ -135,6 +140,30 @@ async function deleteTodo(id) {
 }
 
 
+/**
+ * ==========================================
+ * BONUS: PERSISTENZA CON LOCALSTORAGE
+ * ==========================================
+ * 
+ * Il localStorage permette di salvare dati nel browser che persistono
+ * anche dopo il refresh della pagina.
+ * 
+ * OBIETTIVO: Ricordare quale utente era stato caricato l'ultima volta
+ * 
+ * PASSI DA IMPLEMENTARE:
+ * 
+ * 1️⃣ SALVATAGGIO (in fetchTodosUtente, al passo 10): Salva l'ID come stringa
+ * 2️⃣ CARICAMENTO ALL'AVVIO (aggiungi DOPO gli event listener):
+ *   - Recupera l'ID dal localStorage
+ *   - Se esiste, pre-compila l'input e chiama fetchTodosUtente() automaticamente
+ * 
+ * NOTA: localStorage salva solo stringhe, quindi:
+ * - Salvare: localStorage.setItem('key', valore)
+ * - Recuperare: localStorage.getItem('key')
+ * - Se serve un numero intero: parseInt(localStorage.getItem('key'))
+ */
+
+
 /**
  * FUNZIONE: Visualizza i TODO
  * Funzione già fatta - non modificare
@@ -159,9 +188,7 @@ function displayTodos(todos) {
     `;
     counter.classList.remove('nascosto');
 
-    // CREA CARD TODO
-    const todosHTML = todos.map(todo => creaCardTodos(todo)).join('');
-    todosContainer.innerHTML = todosHTML;
+    creaCardsTodos(todos);
 }
 
 // ===== COLLEGA GLI EVENTI =====