Add Edit Article Functionality (Frontend)

[yashpandav]

Is your feature request related to a problem?

Currently, users can create and view articles, but there is no option to edit existing articles. Adding an intuitive "Edit" feature will empower users to update their content effortlessly, ensuring accuracy and relevance.

Describe the solution you'd like

Describe the solution you'd like

• Edit Button:

  • Display an "Edit" button next to each article for authorized users (authors/admins).
  • Ensure the button is visually distinct yet cohesive with the UI design.

• Edit Form:

  • Create a form pre-filled with the article's current data (title, content, tags, and optional image).
  • Include:
    • Title (text input)
    • Content (rich text editor or textarea)
    • Tags (multi-select dropdown)
    • Image Upload (optional)

• Form Validation:

  • Ensure the title and content are required fields.
  • Add real-time error messages for invalid inputs (like exceeding character limits).

• API Integration:

  • Connect the form to the PUT /api/articles/:id endpoint.
  • Use loading states during submission and handle responses (success or error).

• Feedback and UI Updates:

  • Show a success toast notification after a successful update.
  • Display error messages clearly if the update fails.
  • Redirect the user back to the article page after updating.

• Responsiveness:

  • Ensure the edit form is fully responsive across mobile, tablet, and desktop views.

• Security:

  • Verify the user’s authorization status before rendering the "Edit" button.
  • Prevent unauthorized users from accessing the edit form via direct URL manipulation.

---

Hey @Anwishta, kindly assign this issue to me with appropriate labels.

Feature Area

User Interface

Feature Scope

Frontend

Existing Issue Check

• I have searched for existing issues

Code of Conduct

• I agree to follow the code of conduct

Contributor Status

• I am a SWOC contributor
• I am an IWOC contributor
• Neither