diff --git a/ui/src/common/interface.ts b/ui/src/common/interface.ts index 86c87798..af81d9e6 100644 --- a/ui/src/common/interface.ts +++ b/ui/src/common/interface.ts @@ -620,6 +620,8 @@ export interface BaseReviewItem { answer_count: number; answer_accepted?: boolean; flag_id: string; + url_title: string; + parsed_text: string; } export interface FlagReviewItem extends BaseReviewItem { diff --git a/ui/src/pages/Review/components/FlagContent/index.tsx b/ui/src/pages/Review/components/FlagContent/index.tsx index ed98e5b6..06a08b61 100644 --- a/ui/src/pages/Review/components/FlagContent/index.tsx +++ b/ui/src/pages/Review/components/FlagContent/index.tsx @@ -1,4 +1,4 @@ -import { FC, useEffect, useState } from 'react'; +import { FC, useEffect, useState, useRef } from 'react'; import { Card, Alert, Stack, Button } from 'react-bootstrap'; import { useTranslation } from 'react-i18next'; import { Link } from 'react-router-dom'; @@ -6,7 +6,13 @@ import { Link } from 'react-router-dom'; import classNames from 'classnames'; import { getFlagReviewPostList, putFlagReviewAction } from '@/services'; -import { BaseUserCard, Tag, FormatTime } from '@/components'; +import { + BaseUserCard, + Tag, + FormatTime, + ImgViewer, + htmlRender, +} from '@/components'; import { scrollToDocTop } from '@/utils'; import type * as Type from '@/common/interface'; import { ADMIN_LIST_STATUS } from '@/common/constants'; @@ -19,6 +25,7 @@ interface IProps { const Index: FC = ({ refreshCount }) => { const { t } = useTranslation('translation', { keyPrefix: 'page_review' }); + const ref = useRef(null); const [noTasks, setNoTasks] = useState(false); const [isLoading, setIsLoading] = useState(false); const [page, setPage] = useState(1); @@ -86,6 +93,14 @@ const Index: FC = ({ refreshCount }) => { }); }; + useEffect(() => { + if (!ref.current) { + return; + } + + htmlRender(ref.current); + }, [ref.current]); + const { object_type, submitter_user, @@ -155,7 +170,13 @@ const Index: FC = ({ refreshCount }) => { )}
- {flagItemData?.original_text} + +
+
diff --git a/ui/src/pages/Review/components/QueuedContent/index.tsx b/ui/src/pages/Review/components/QueuedContent/index.tsx index 3f4b3fe5..c5252130 100644 --- a/ui/src/pages/Review/components/QueuedContent/index.tsx +++ b/ui/src/pages/Review/components/QueuedContent/index.tsx @@ -1,4 +1,4 @@ -import { FC, useEffect, useState } from 'react'; +import { FC, useEffect, useState, useRef } from 'react'; import { Card, Alert, Stack, Button } from 'react-bootstrap'; import { useTranslation } from 'react-i18next'; import { Link, useSearchParams } from 'react-router-dom'; @@ -6,7 +6,14 @@ import { Link, useSearchParams } from 'react-router-dom'; import classNames from 'classnames'; import { getPendingReviewPostList, putPendingReviewAction } from '@/services'; -import { BaseUserCard, Tag, FormatTime, Icon } from '@/components'; +import { + BaseUserCard, + Tag, + FormatTime, + Icon, + ImgViewer, + htmlRender, +} from '@/components'; import { scrollToDocTop } from '@/utils'; import type * as Type from '@/common/interface'; import { ADMIN_LIST_STATUS } from '@/common/constants'; @@ -20,6 +27,7 @@ const Index: FC = ({ refreshCount }) => { const [urlSearch, setUrlSearchParams] = useSearchParams(); const objectId = urlSearch.get('objectId') || ''; const { t } = useTranslation('translation', { keyPrefix: 'page_review' }); + const ref = useRef(null); const [noTasks, setNoTasks] = useState(false); const [isLoading, setIsLoading] = useState(false); const [page, setPage] = useState(1); @@ -56,6 +64,14 @@ const Index: FC = ({ refreshCount }) => { }); }; + useEffect(() => { + if (!ref.current) { + return; + } + + htmlRender(ref.current); + }, [ref.current]); + useEffect(() => { queryNextOne(page, objectId); }, []); @@ -140,7 +156,13 @@ const Index: FC = ({ refreshCount }) => { )}
- {flagItemData?.original_text} + +
+
diff --git a/ui/src/pages/Review/utils/generateData.ts b/ui/src/pages/Review/utils/generateData.ts index 42d80726..e02bcd4f 100644 --- a/ui/src/pages/Review/utils/generateData.ts +++ b/ui/src/pages/Review/utils/generateData.ts @@ -15,21 +15,21 @@ export default (data: any) => { question_id = '', answer_id = '', comment_id = '', - title = '', + url_title = '', } = data; let itemLink = ''; let itemId = ''; let itemTimePrefix = ''; if (object_type === 'question') { - itemLink = pathFactory.questionLanding(String(object_id), title); + itemLink = pathFactory.questionLanding(String(object_id), url_title); itemId = String(question_id); itemTimePrefix = 'asked'; } else if (object_type === 'answer') { itemLink = pathFactory.answerLanding({ // @ts-ignore questionId: question_id, - slugTitle: title, + slugTitle: url_title, answerId: String(object_id), }); itemId = String(object_id); @@ -43,7 +43,7 @@ export default (data: any) => { } else { itemLink = `${pathFactory.questionLanding( String(question_id), - title, + url_title, )}?commentId=${comment_id}`; } itemId = String(comment_id);