From ec24d9e9f8f487e7d7b7f263aa8f462362944ecc Mon Sep 17 00:00:00 2001
From: shuai <lishuailing@sifou.com>
Date: Tue, 4 Apr 2023 17:30:39 +0800
Subject: [PATCH] fix: write question width answert use a new api  #299

---
 ui/src/common/interface.ts           |  5 +-
 ui/src/pages/Questions/Ask/index.tsx | 75 +++++++++++++++-------------
 ui/src/services/common.ts            |  4 ++
 ui/src/utils/saveDraft.ts            |  2 +-
 4 files changed, 49 insertions(+), 37 deletions(-)

diff --git a/ui/src/common/interface.ts b/ui/src/common/interface.ts
index 507f16a5c..cb6b63e38 100644
--- a/ui/src/common/interface.ts
+++ b/ui/src/common/interface.ts
@@ -56,10 +56,13 @@ export interface QuestionParams {
   title: string;
   url_title?: string;
   content: string;
-  html?: string;
   tags: Tag[];
 }
 
+export interface QuestionWithAnswer extends QuestionParams {
+  answer_content: string;
+}
+
 export interface ListResult<T = any> {
   count: number;
   list: T[];
diff --git a/ui/src/pages/Questions/Ask/index.tsx b/ui/src/pages/Questions/Ask/index.tsx
index 6f12a5192..ffc1bfbbc 100644
--- a/ui/src/pages/Questions/Ask/index.tsx
+++ b/ui/src/pages/Questions/Ask/index.tsx
@@ -16,9 +16,10 @@ import {
   questionDetail,
   modifyQuestion,
   useQueryRevisions,
-  postAnswer,
+  // postAnswer,
   useQueryQuestionByTitle,
   getTagsBySlugName,
+  saveQuestionWidthAnaser,
 } from '@/services';
 import { handleFormError, SaveDraft, storageExpires } from '@/utils';
 import { pathFactory } from '@/router/pathFactory';
@@ -29,7 +30,7 @@ interface FormDataItem {
   title: Type.FormValue<string>;
   tags: Type.FormValue<Type.Tag[]>;
   content: Type.FormValue<string>;
-  answer: Type.FormValue<string>;
+  answer_content: Type.FormValue<string>;
   edit_summary: Type.FormValue<string>;
 }
 
@@ -52,7 +53,7 @@ const Ask = () => {
       isInvalid: false,
       errorMsg: '',
     },
-    answer: {
+    answer_content: {
       value: '',
       isInvalid: false,
       errorMsg: '',
@@ -92,7 +93,7 @@ const Ask = () => {
       return;
     }
     getTagsBySlugName(queryTags).then((tags) => {
-      // eslint-disable-next-line @typescript-eslint/no-use-before-define
+      // eslint-disable-next-line
       handleTagsChange(tags);
     });
   };
@@ -116,8 +117,8 @@ const Ask = () => {
         formData.title.value = draft.title;
         formData.content.value = draft.content;
         formData.tags.value = draft.tags;
-        formData.answer.value = draft.answer;
-        setCheckState(Boolean(draft.answer));
+        formData.answer_content.value = draft.answer_content;
+        setCheckState(Boolean(draft.answer_content));
         setHasDraft(true);
         setFormData({ ...formData });
       } else {
@@ -131,7 +132,7 @@ const Ask = () => {
   }, [qid]);
 
   useEffect(() => {
-    const { title, tags, content, answer } = formData;
+    const { title, tags, content, answer_content } = formData;
     const { title: editTitle, tags: editTags, content: editContent } = immData;
 
     // edited
@@ -151,14 +152,19 @@ const Ask = () => {
       return;
     }
     // write
-    if (title.value || tags.value.length > 0 || content.value || answer.value) {
+    if (
+      title.value ||
+      tags.value.length > 0 ||
+      content.value ||
+      answer_content.value
+    ) {
       // save draft
       saveDraft.save({
         params: {
           title: title.value,
           tags: tags.value,
           content: content.value,
-          answer: answer.value,
+          answer_content: answer_content.value,
         },
         callback: () => setHasDraft(true),
       });
@@ -215,7 +221,7 @@ const Ask = () => {
   const handleAnswerChange = (value: string) =>
     setFormData({
       ...formData,
-      answer: { ...formData.answer, value, errorMsg: '' },
+      answer_content: { ...formData.answer_content, value, errorMsg: '' },
     });
 
   const handleSummaryChange = (evt: React.ChangeEvent<HTMLInputElement>) =>
@@ -263,31 +269,30 @@ const Ask = () => {
           }
         });
     } else {
-      const res = await saveQuestion(params).catch((err) => {
-        if (err.isError) {
-          const data = handleFormError(err, formData);
-          setFormData({ ...data });
-        }
-      });
+      let res;
+      if (checked) {
+        res = await saveQuestionWidthAnaser({
+          ...params,
+          answer_content: formData.answer_content.value,
+        }).catch((err) => {
+          if (err.isError) {
+            const data = handleFormError(err, formData);
+            setFormData({ ...data });
+          }
+        });
+      } else {
+        res = await saveQuestion(params).catch((err) => {
+          if (err.isError) {
+            const data = handleFormError(err, formData);
+            setFormData({ ...data });
+          }
+        });
+      }
 
-      const id = res?.id;
+      const id = res?.id || res?.question?.id;
       if (id) {
         if (checked) {
-          postAnswer({
-            question_id: id,
-            content: formData.answer.value,
-          })
-            .then(() => {
-              navigate(pathFactory.questionLanding(id, params.url_title));
-            })
-            .catch((err) => {
-              if (err.isError) {
-                const data = handleFormError(err, formData, [
-                  { from: 'content', to: 'answer' },
-                ]);
-                setFormData({ ...data });
-              }
-            });
+          navigate(pathFactory.questionLanding(id, res?.question?.url_title));
         } else {
           navigate(pathFactory.questionLanding(id));
         }
@@ -448,7 +453,7 @@ const Ask = () => {
                   <Form.Group controlId="answer" className="mt-4">
                     <Form.Label>{t('form.fields.answer.label')}</Form.Label>
                     <Editor
-                      value={formData.answer.value}
+                      value={formData.answer_content.value}
                       onChange={handleAnswerChange}
                       ref={editorRef2}
                       className={classNames(
@@ -464,11 +469,11 @@ const Ask = () => {
                     />
                     <Form.Control
                       type="text"
-                      isInvalid={formData.answer.isInvalid}
+                      isInvalid={formData.answer_content.isInvalid}
                       hidden
                     />
                     <Form.Control.Feedback type="invalid">
-                      {formData.answer.errorMsg}
+                      {formData.answer_content.errorMsg}
                     </Form.Control.Feedback>
                   </Form.Group>
                 )}
diff --git a/ui/src/services/common.ts b/ui/src/services/common.ts
index a7b415527..bab132228 100644
--- a/ui/src/services/common.ts
+++ b/ui/src/services/common.ts
@@ -274,3 +274,7 @@ export const markdownToHtml = (content: string) => {
   const apiUrl = '/answer/api/v1/post/render';
   return request.post(apiUrl, { content });
 };
+
+export const saveQuestionWidthAnaser = (params: Type.QuestionWithAnswer) => {
+  return request.post('/answer/api/v1/question/answer', params);
+};
diff --git a/ui/src/utils/saveDraft.ts b/ui/src/utils/saveDraft.ts
index 65a3df120..2d579f65a 100644
--- a/ui/src/utils/saveDraft.ts
+++ b/ui/src/utils/saveDraft.ts
@@ -11,7 +11,7 @@ export type QuestionDraft = {
     title: string;
     content: string;
     tags: any[];
-    answer: string;
+    answer_content: string;
   };
   callback?: () => void;
 };