Codstak
    • Home
    • DSA
    • JavaScript
    • TypeScript
    • Node.js
    • React
    • More↓
      BlogReact PrepPricingDiscordNewsletterLeaderboard
    React challenge/easy

    Todo: Toggle a Task

    Challenge workspace

    15-20 min
    Lists and formsPath 7/33
    ListsState & events

    Suggested first

    Todo: Add a Task

    Your workspace must pass its server-side browser checks to complete this challenge.

    Todo: Toggle a Task

    The task list is already supplied. Practice changing one object in an array of state.

    IDs already provided

    • todo-list contains both tasks.
    • todo-read and todo-walk identify the task rows.
    • toggle-read and toggle-walk identify their matching controls.

    Requirements

    • Toggle the selected task's done value.
    • Leave the unselected task unchanged.
    • Create a new object for the task you update.
    • Add the done class to a completed task row.

    Hints

    • map returns a new array with the same number of items.
    • Use the item ID to decide which task receives the updated object.