RenewCMS/docs/design/screens/new-article.md

New article

• Route: modal from anywhere · /article/new
• API: POST /v1/article/
• Visual reference: source/RenewCMS Screens Back-office.dc.html, group "New article" (open it in a browser; each state is drawn at desktop and mobile, with a light/dark toggle).

Recommendation: a modal. It needs two fields, and keeping the page underneath means cancelling costs nothing. /article/new opens the same modal over the article list, so it can be linked to and the back button closes it. A successful create always makes a draft and goes to the editor.

States

Default

Trigger: "New article" from Home, Articles or the empty state.

• Breadcrumbs: Articles (mobile title "Articles")
• Modal: New article
  • text "It's saved as a draft. Titles can't be changed later, so check it now."
  • field Title: placeholder "e.g. Choosing tiles for a small bathroom"; focused; counter "0 / 200"; help "3 to 200 characters."
  • field First paragraph: placeholder "Start writing. You'll continue in the editor."; textarea; help "You can format it and add images in the editor."
  • cancel "Cancel"
  • confirm "Create draft"

Validation

Trigger: On submit or blur. Nothing is sent.

• Breadcrumbs: Articles (mobile title "Articles")
• Modal: New article
  • text "It's saved as a draft. Titles can't be changed later, so check it now."
  • field Title: value "Ti"; counter "2 / 200" in error; error "Use at least 3 characters."
  • field First paragraph: textarea; error "Add a first paragraph. It can be a single sentence."
  • cancel "Cancel"
  • confirm "Create draft"

Submitting

Trigger: Request in flight. Fields are disabled and the dialog can't be dismissed.

• Breadcrumbs: Articles (mobile title "Articles")
• Modal: New article
  • text "It's saved as a draft. Titles can't be changed later, so check it now."
  • field Title: value "Choosing tiles for a small bathroom"; counter "35 / 200"
  • field First paragraph: value "Small rooms show every grout line, so we start with the floor."; textarea
  • cancel "Cancel"
  • confirm "Creating…", loading, not dismissible

Title rejected (400)

Trigger: A server 400 that got past the browser checks. The raw error isn't shown.

• Breadcrumbs: Articles (mobile title "Articles")
• Modal: New article
  • text "It's saved as a draft. Titles can't be changed later, so check it now."
  • field Title: value "Choosing tiles for a small bathroom"; counter "35 / 200"; error "Check this title and try again."
  • field First paragraph: value "Small rooms show every grout line, so we start with the floor."; textarea
  • Alert: "Something in the form isn't valid. Check the highlighted fields."
  • cancel "Cancel"
  • confirm "Create draft"

Error

Trigger: 500 or network failure.

• Breadcrumbs: Articles (mobile title "Articles")
• Modal: New article
  • text "It's saved as a draft. Titles can't be changed later, so check it now."
  • field Title: value "Choosing tiles for a small bathroom"; counter "35 / 200"
  • field First paragraph: value "Small rooms show every grout line, so we start with the floor."; textarea
  • Alert: "Couldn't create the article. Your text is still here. Try again in a moment."
  • cancel "Cancel"
  • confirm "Create draft"