Article editor refactor for reuse and layout updates

[jonkafton]

What are the relevant tickets?

N/A

Description (What does it do?)

• Refactors common create/update logic to the new ArticleEditor component (replaces EditorContainer).
• Updates layout for full width header fixed toolbar.
• Title input moved into shared component.
• Save button moved to toolbar.
• Error messaging from query hooks (replaces onError handling).
• Removes /article/new route from initial editor PR, Initial Tiptap Editor #2691.

Screenshots (if appropriate):

How can this be tested?

Additional Context

[ahtesham-quraish]

Your Changes look good to me!

[ahtesham-quraish]

@jonkafton there is bug in your code

const [json, setJson] = useState<JSONContent>({
   type: "doc",
   content: article?.content
     ? JSON.parse(article.content)
     : [{ type: "paragraph", content: [] }],
 })

You dont need to parse the content here, the content is already in json shap.

2 - Secondly you need to initialize the state properly.

This should be

const [json, setJson] = useState<JSONContent>({
    type: "doc",
    content: article?.content
      ? article.content
      : [{ type: "paragraph", content: [] }],
  })

replace with following

const [json, setJson] = useState<JSONContent>(article?.content || {
    type: "doc",
    content: [{ type: "paragraph", content: [] }],
  })

with your code it does not work for me I have to make changes locally to get this work

[ahtesham-quraish]

After editing the article it should lead me to article detail page which is not happening RN

[ahtesham-quraish]

There is one more issue related to initializing the editor state from existing article

Currently we have in code.

content: value || {
      type: "doc",
      content: [{ type: "paragraph", content: [] }],
    },

it should be replaced with this

content: json || value || {
      type: "doc",
      content: [{ type: "paragraph", content: [] }],
   },

then it will show the article content.

[jonkafton]

thanks @ahtesham-quraish . Not ready for review just yet

[jonkafton]

it should be replaced with this

content: json || value || {
type: "doc",
content: [{ type: "paragraph", content: [] }],
}

We're not actually using the value prop. Check 3dc59f6, which removes the useEffect() as we have a state controlled component.

[ahtesham-quraish]

it should be replaced with this

content: json || value || {
type: "doc",
content: [{ type: "paragraph", content: [] }],
}

We're not actually using the value prop. Check 3dc59f6, which removes the useEffect() as we have a state controlled component.

Yeah totally fine.

[github-actions]

OpenAPI Changes

Show/hide No detectable change.

Unexpected changes? Ensure your branch is up-to-date with main (consider rebasing).

[ahtesham-quraish]

LGTM!