[Trees] Edit Tree Flow (part 2 of 2)

[seanmnguyen]

Description

Now that the Trees table component and Control Panel are being wired up, we need the ability to edit an existing tree record from the table.

The flow for entering "edit mode" is as follows:

• replaces four main buttons (Edit, Delete, Export CSV, and Add Tree) with a "Finish" button; clicking Finish leaves "edit mode" and restores the original buttons
• highlight rows on hover
• clicking a row opens an Edit Tree popup form ([NOT READY][Trees] Edit Tree Flow (part 1 of 2) #56)
• submitting uses the PUT Tree API slug (6/PUT-Admin-Trees-Slug #14) to update the record

Notes

• Make sure to run git pull before any development work
• Complete your development in a new branch
• Link this issue to your PR
• Feel free to reach out if you have any questions!

Acceptance Criteria

• Entering "edit mode" replaces the control buttons with a single "Finish" button.
• Hovering a tree row visually highlights it.
• Clicking a row opens an Edit Tree popup pre-filled with the selected tree's values.
• While the popup is open, other page actions are visually "greyed out" / disabled to prevent conflicting actions.
• Clicking Save issues a PUT request to update that tree and refreshes the table UI with the new values.
• Clicking Cancel closes the popup and restores the previous view.
• Errors are shown clearly (toast and/or inline form error).

Task

• Replace the four control buttons when in "edit mode" with a Finish button
• Add row hover highlight + clickable row behavior in the Trees table
• Open an Edit Tree popup component when a row is clicked
• Prefill popup fields with the selected row's tree data
• On Save, call PUT /api/admin/trees/[id] with updated fields
• Show success/error feedback and refresh the displayed table data on success

Additional Information

Edit Tree Popup