debugfest/mern-book-tracker

Feature Request: Edit Book UI with Optimistic Update

Open

#4 opened on Oct 11, 2025

View on GitHubContributor guide
 (1 comment) (0 reactions) (1 assignee)TypeScript (5 forks)auto 404
enhancementgood first issuehacktoberfest

Repository metrics

Stars
 (0 stars)
PR merge metrics
 (PR metrics pending)

Description

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.

Contributor guide

Research direction
Implement the edit book UI component and connect it to the PUT /api/books/:id endpoint with optimistic updates and rollback using React Query or manual state management.
Tech stack
typescriptreactnodejsexpressmongodb
Domain
frontend
Issue type
Feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
2
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
Half day
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
Active
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
Clear
Prerequisites
ReactTypeScriptGit
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
70