debugfest/mern-book-tracker

Feature Request: Edit Book UI with Optimistic Update

Aperta

#4 aperta il 11 ott 2025

Vedi su GitHubGuida contributor
 (1 commento) (0 reazioni) (1 assegnatario)TypeScript (5 fork)auto 404
enhancementgood first issuehacktoberfest

Metriche repository

Star
 (0 stelle)
Metriche merge PR
 (Metriche PR in attesa)

Descrizione

Allow users to edit existing book details using a modal or dedicated edit page. The UI should optimistically update book details while waiting for the server response.

🎯 Proposed Solution

  • Add Edit button on each book card.
  • Create EditBook.tsx or modal-based editor.
  • Pre-fill form with existing data.
  • PUT /api/books/:id for saving updates.
  • Implement optimistic updates and rollback if the request fails.

✅ Expected Behavior

  • User can edit book fields and save.
  • UI updates immediately on save click.
  • Changes persist after backend confirmation.

💻 Technical Notes

  • Maintain a local copy of book data for rollback if needed.
  • Use React Query or manual state updates for optimistic UI.

🧪 Test Steps

  1. Open edit form for a book.
  2. Modify title or author → save changes.
  3. Observe instant update and confirmation after server response.

Guida contributor

Direzione di ricerca
Implementa il componente UI di modifica del libro e collegalo all'endpoint PUT /api/books/:id con aggiornamenti ottimistici e rollback utilizzando React Query o la gestione manuale dello stato.
Tech stack
typescriptreactnodejsexpressmongodb
Dominio
frontend
Tipo issue
Funzionalità
DifficoltàQuanto dovrebbe essere impegnativa per un nuovo contributor.
2
Tempo stimatoTempo stimato per completare e verificare uno scope piccolo.
Mezza giornata
Stato attivitàQuanto è probabile che la issue sia ancora attiva e reviewable.
Attiva
ChiarezzaQuanto chiaramente la issue descrive problema, scope e risultato atteso.
Chiara
Prerequisiti
ReactTypeScriptGit
Adatta ai principiantiQuanto la issue è adatta a contributor alla prima esperienza.
70