Listing - Edit Listing

[lian-jung]

Context

This issue proposes the implementation of the Edit Listing page for Sharers, as depicted in the attached screenshot. This view enables users to edit details of an active or draft listing, consistent with design and requirements from the SRD/BRD documents.

References:

• Business Requirements Document (BRD) — Sections: Listing Processing > Edit Listing
• System Requirements Document (SRD) — User Journeys: Listing > Edit Listing

Requirements

• Page must allow editing of the following listing fields:
  • Title
  • Location
  • Category (dropdown)
  • Reservation Period (date range picker)
  • Description (character count enforced)
  • Listing photos (image upload, preview, delete)
• Listing actions:
  • Save Changes
  • Cancel
  • Delete (permanently removes listing)
  • Cancel Listing (moves to cancelled state, see SRD)
  • Pause (moves to paused state, see SRD)
• Page layout must match the provided screenshot, including sidebar navigation, listing preview, and form controls.
• All required fields must be validated and error states shown according to UI guidelines.
• Permission logic must ensure only the listing owner may edit/delete/pause/cancel the listing (see BRD/SRD for rules).
• Integrate with backend API for update, delete, pause, and cancel actions.
• Show success/error messages for actions using Ant Design components.
• Accessible (ARIA, keyboard navigation, semantic HTML).
• Responsive design and proper alignment.

Additional Information

• Use Ant Design components and Tailwind CSS for styling as described in UI Instructions.
• Implement error and loading states using <Skeleton />, <Empty />, and Ant Design <message /> for feedback.
• All actions must respect business logic for listing states (active, draft, cancelled, paused, deleted) as defined in the SRD/BRD.

---

Acceptance Criteria

• User can edit all editable listing fields and save changes
• User can upload/remove listing photos
• Actions (Delete, Cancel Listing, Pause) correctly update listing state and are only enabled per business rules
• UI matches provided screenshot and adheres to accessibility and style guidelines
• All changes are persisted via backend API and error/success feedback is shown

---

For additional requirements and business rules, see:

• BRD: Listing Processing > Edit Listing
• SRD: Listing > Edit Listing