Merge branch 'feat/ui-0.5.0' into 'test'

Feat/ui 0.5.0

See merge request opensource/answer!309

ui/src/components/Operate/index.tsx

@@ -1,6 +1,6 @@
 import { memo, FC } from 'react';
 import { Button } from 'react-bootstrap';
-import { Link } from 'react-router-dom';
+import { Link, useNavigate } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 
 import { Modal } from '@/components';
@@ -31,6 +31,7 @@ const Index: FC<IProps> = ({
 }) => {
   const { t } = useTranslation('translation', { keyPrefix: 'delete' });
   const toast = useToast();
+  const navigate = useNavigate();
   const reportModal = useReportModal();
   const closeModal = useReportModal();
   const editUrl =
@@ -96,13 +97,14 @@ const Index: FC<IProps> = ({
       });
     }
   };
-  const handleEdit = async (evt) => {
+  const handleEdit = (evt, targetUrl) => {
+    evt.preventDefault();
     let checkObjectId = qid;
     if (type === 'answer') {
       checkObjectId = aid;
     }
-    editCheck(checkObjectId).catch(() => {
-      evt.preventDefault();
+    editCheck(checkObjectId).then(() => {
+      navigate(targetUrl);
     });
   };
 
@@ -133,7 +135,7 @@ const Index: FC<IProps> = ({
               key={item.action}
               to={editUrl}
               className="link-secondary p-0 fs-14 me-3"
-              onClick={handleEdit}
+              onClick={(evt) => handleEdit(evt, editUrl)}
               style={{ lineHeight: '23px' }}>
               {item.name}
             </Link>

ui/src/utils/common.ts

@@ -177,13 +177,27 @@ function diffText(newText: string, oldText: string): string {
       ?.replace(/<input/gi, '&lt;input');
   }
   const diff = Diff.diffChars(oldText, newText);
+  // console.log(diff);
   const result = diff.map((part) => {
     if (part.added) {
-      return `<span class="review-text-add">${part.value}</span>`;
+      if (part.value.replace(/\n/g, '').length <= 0) {
+        return `<span class="review-text-add d-block">${part.value.replace(
+          /\n/g,
+          '↵\n',
+        )}</span>`;
+      }
+      return `<span class="review-text-add d-block">${part.value}</span>`;
     }
     if (part.removed) {
+      if (part.value.replace(/\n/g, '').length <= 0) {
+        return `<span class="review-text-delete text-decoration-none d-block">${part.value.replace(
+          /\n/g,
+          '↵\n',
+        )}</span>`;
+      }
       return `<span class="review-text-delete">${part.value}</span>`;
     }
+
     return part.value;
   });